Característica border-bottom-width en CSS

La propiedad border-bottom-width CSS establece el ancho del marco inferior de un elemento.

Funciones border-bottom-width css

Valor inicial	`medium`
Aplicado a	Todos los artículos.
Heredable	No
Móvil	Sí
Valor calculado	Longitud absoluta, o 0 si la propiedad se establece `border-bottom-style` en `none`o `hidden`.

/* palabras clave */ 
border-bottom-width: thin;
border-bottom-width: medium;
border-bottom-width: thick;
/*  longitud */ 
border-bottom-width: 10em;
border-bottom-width: 3vmax;
border-bottom-width: 6px;
/* valores globales */ 
border-bottom-width: inherit;
border-bottom-width: initial;
border-bottom-width: unset;

Ejemplos y aplicaciones

En el siguiente ejemplo, estableceremos un marco para los elementos que son de

color (border-bottom-color) rojo, ancho (border-bottom-width) igual 4pxy border-bottom-style punteado ( ).

Código HTML:

< div > Este elemento tiene un marco en su borde inferior

Código CSS:

div {
  border-bottom-style: dotted;
  border-bottom-width: 4px;
  border-bottom-color: green;
  padding: 0.5em;
}

Soporte de navegadores

Característica	Chrome	Firefox	IE	Ópera	Safari
Soporte básico	1.0	1.0	4.0	3,5	1.0

Características generales

Este valor define el ancho del marco, ya sea una longitud no negativa o una palabra reservada. Se pueden utilizar las siguientes palabras reservadas:

`thin`	marco delgado
`medium`	marco mediano
`thick`	marco grueso

Nota: Debido a que la especificación no especifica cuál es el valor exacto asociado con cada palabra reservada, el resultado puede variar según el navegador, pero no obstante, estos valores seguirán la relación thin ≤ medium ≤ thick y los valores serán consistentes entre sí en el documento.

Estructura

border-bottom-width: ;

dónde:

 =  | thin | medium | thick

Vea también

La página de propiedades establecida por la propiedad de acceso directo border-bottom: border-bottom-color y border-bottom-style.
La página de propiedades establecido por la propiedad de acceso directo border: border-width, border-style, y border-color.
Configure una imagen para el marco usando la función border-image.
Esquinas redondeadas y border-radius esquinas inferiores, border-bottom-left-radius, border-bottom-right-radius