Los datos expuestos en este blog, son solo de índole informativo. Por favor realiza siempre una copia de seguridad antes de realizar cualquier cambio en tu proyecto.
CSS: propiedad de ancho inferior del borde
Este tutorial de CSS explica cómo usar una propiedad de CSS llamada ancho inferior del borde Con sintaxis y ejemplos.
describir
La propiedad CSS border-bottom-width define el ancho del borde inferior de un cuadro.
sintaxis
La sintaxis de la propiedad CSS border-bottom-width es:
border-bottom-width: value;parámetro o parámetro
valor
El ancho del borde inferior del cuadro. Puede ser uno de los siguientes:
| valor | describir |
|---|---|
| estable | valor fijo en px, em, … div {ancho inferior del borde: 2px; } |
| finamente | Ancho de borde delgado, puede ser 1px o 2px dependiendo del navegador div {borde inferior ancho: delgado;} |
| Moderar | Ancho de borde medio, puede ser de 3px o 4px dependiendo del navegador div {borde-fondo-ancho: medio;} |
| Grueso | Ancho de borde grueso, puede ser 5px o 6px según el navegador div {ancho inferior del borde: grueso;} |
notas
- Asegúrese de establecer también la propiedad border-bottom-style para garantizar que aparezca un borde inferior.
- Consulte también las propiedades border-bottom-color, border-bottom-style y border-bottom.
Compatibilidad del navegador
La propiedad CSS border-bottom-width tiene soporte básico para los siguientes navegadores:
- Aleación de cromo
- androide
- Firefox (Geco)
- Firefox móvil (Geco)
- Navegador de Internet (IE)
- es decir, móvil
- ópera
- Ópera Móvil
- Safari (WebKit)
- Safari para móvil
ejemplo
Discutiremos la propiedad border-bottom-width a continuación, explorando ejemplos de cómo usarla en CSS.
Veamos un ejemplo de configuración del borde inferior a un ancho fijo.
div { border-bottom-width: 2px; border-bottom-style: solid; }En este ejemplo de estilo inferior de borde CSS, establecemos el ancho del borde inferior en 2px. Asegúrese de aplicar el estilo de borde inferior para que aparezca el borde.
A continuación, intentemos establecer el ancho de nuestro borde inferior usando una de las palabras clave de ancho (delgado, medio, grueso).
div { border-bottom-width: thick; border-bottom-style: solid; }En este ejemplo de estilo de borde inferior, configuramos el borde inferior para que sea grueso.