Propiedad: Frontera estilo
Uso:
border-style: dotted;
border-style: dashed;
border-style: solid;
border-style: double;
border-style: groove;
border-style: ridge;
border-style: inset;
border-style: outset;
Definición:
El estilo del borde puede establecerse usando la etiqueta border-style. Esta toma los siguientes valores:
a)dotted- Creará un borde con lineas punteadas.
b)dashed- Creará un borde con líneas rayadas.
c)solid- Creará un borde con líneas sólidas.
d)double- Creará un borde con lineas dobles.
e)groove- Creará un borde que se verá estriado.
f)ridge- Creará un borde que se verá encrestado.
g)inset- Creará un borde que con la línea biselada.
h)outset- Creará un borde con la línea biselada al lado contrario.
Ejemplo 1:
<div style="border-width: 2px; border-style: dotted; border-color: red; ">
probando estilo de borde </div>
Resultado:
probando estilo de borde
Ejemplo 2:
<div style="border-width: 2px; border-style: dashed; border-color: red; "> probando estilo de borde </div>
Resultado:
probando estilo de borde
Ejemplo 3:
<div style="border-width: 2px; border-style: solid; border-color: red; "> probando estilo de borde</div>
Resultado:
probando estilo de borde
Ejemplo 4:
<div style="border-width: 4px; border-style: double; border-color: red; "> probando estilo de borde</div>
Resultado:
probando estilo de borde
Ejemplo 5:
<div style="border-width: 4px; border-style: groove; border-color: red; "> probando estilo de borde</div>
Resultado:
probando estilo de borde
Ejemplo 6:
<div style="border-width: 4px; border-style: ridge; border-color: red; "> probando estilo de borde</div>
Resultado:
probando estilo de borde
Ejemplo 7:
<div style="border-width: 4px; border-style: inset; border-color: red; ">probando estilo de borde</div>
Resultado:
probando estilo de borde
Ejemplo 8:
<div style="border-width: 4px; border-style: outset; border-color: red; "> probando estilo de borde</div>
Resultado:
probando estilo de borde
|