| Definición | Establece la anchura del borde inferior de los elementos |
|---|---|
| Valores permitidos | Uno y sólo uno de los siguientes valores: |
| Valor inicial | medium |
| Se aplica a | Todos los elementos |
| Válida en | medios visuales |
| Se hereda | no |
| Definición en el estándar | w3.org/TR/CSS21/box.html#propdef-border-bottom-width |
Ejemplos de uso
La propiedad border-bottom-width permite establecer la anchura del borde inferior de un elemento de diferentes formas. En primer lugar, es posible utilizar las palabras thin, medium y thick para mostrar un borde fino, normal y grueso respectivamente:
Como la especificación oficial no define de forma explícita el valor que corresponde a thin, medium y thick, cada navegador los muestra de un grosor diferente. Por este motivo no suelen utilizarse estas palabras especiales, ya que es imposible diseñar con ellas una página que muestre el mismo aspecto en diferentes navegadores.
Normalmente, el grosor de los bordes se establece mediante una medida. La unidad de medida que más se utiliza es el píxel, ya que permite un control más preciso sobre el grosor del borde:
Si se utiliza em como unidad de medida, su referencia es el tamaño de letra del propio elemento. En el siguiente ejemplo, el grosor del borde inferior de los dos elementos es 0.3em. Sin embargo, como el tamaño de letra del segundo <div> es mayor, su borde inferior es más grueso:
Para eliminar el borde inferior de un elemento, se puede utilizar la propiedad border-bottom-width asignándole un grosor igual a 0: