Atributo border-bottom do CSS

Definição e uso

A propriedade abreviada border-bottom coloca todas as propriedades da borda inferior em uma única declaração.

Os seguintes atributos podem ser definidos em ordem:

Se nenhuma dessas propriedades for definida, não haverá problema, por exemplo, border-bottom:solid #ff0000; também é permitido.

Veja também:

Tutorial de CSS:Borda do CSS

Manual do HTML DOM:Propriedade borderBottom

Exemplo

Definir o estilo da borda inferior:

p
  {
  border-style:solid;
  border-bottom:thick dotted #ff0000;
  }

Experimente você mesmo

Sintaxe do CSS

border-bottom: border-width border-style border-color|initial|inherit;

Valor da propriedade

Valores Descrição
border-bottom-width Define a largura da borda inferior. Veja:border-bottom-width valores possíveis.
border-bottom-style Define o estilo da borda inferior. Veja:border-bottom-style valores possíveis.
border-bottom-color Define a cor da borda inferior. Veja:border-bottom-color valores possíveis.
inherit Define que a propriedade border-bottom deve ser herdada do elemento pai.

Detalhes técnicos

Valor padrão: não especificado
Herança: não
Versão: CSS1
Sintaxe do JavaScript: object.style.borderBottom="3px solid blue"

Mais exemplos

Todas as propriedades de borda inferior em uma única declaração
Este exemplo demonstra como usar a propriedade abreviada para definir todas as propriedades de borda inferior em uma única declaração.

Suporte do navegador

Os números na tabela indicam a primeira versão do navegador que suporta plenamente essa propriedade.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5

Notas:Os navegadores IE7 e anteriores não suportam o valor "inherit". O IE8 requer !DOCTYPE. O IE9 suporta "inherit".