Table of contents
Las propiedades de borde CSS le permiten especificar el estilo, el ancho y el color del borde de un elemento.👇
Estilo de bordes
La propiedad border-style
especifica qué tipo de borde mostrar.
Los siguientes valores son permitidos:
dotted
- Define un borde punteadodashed
- Define un borde discontinuosolid
- Define un borde sólidodouble
- Define un borde doblegroove
- Define un borde ranurado 3D. El efecto depende del valor del color del borde.ridge
- Define un borde estriado 3D. El efecto depende del valor del color del borde.inset
- Define un borde insertado 3D. El efecto depende del valor del color del borde.outset
- Define un borde inicial 3D. El efecto depende del valor del color del borde.none
- No define ningún bordehidden
- Define un borde oculto
La propiedad border-style
puede tener de uno a cuatro valores (para el borde superior, el borde derecho, el borde inferior y el borde izquierdo).
Ejemplo:
Demo de los diferentes estilos de borde:
Nota: Ninguna de las OTRAS propiedades de borde de CSS (sobre las que aprenderá más en los próximos capítulos) tendrá NINGÚN efecto a menos que se establezca la propiedad de estilo de borde.
Resumen
La propiedad border-style
en CSS especifica el tipo de borde a mostrar, con valores como dotted
, dashed
, solid
, double
, groove
, ridge
, inset
, outset
, none
y hidden
. Puede tener de uno a cuatro valores para cada borde. Ninguna otra propiedad de borde tendrá efecto a menos que se establezca la propiedad de estilo de borde.
Traducido con 💚 desde W3Schools.com