Noções básicas de trabalho com bordas em CSS
Agora vamos aprender a adicionar borda
aos elementos. Isso é feito usando três propriedades:
a propriedade border-width define a espessura
da borda, border-color - a cor, e border-style
define o tipo de borda.
As duas primeiras propriedades funcionam de forma óbvia:
border-color aceita cores no
mesmo formato que a propriedade color,
e a espessura da borda é definida em pixels. Já
a propriedade border-style aceita
valores na forma de palavras-chave. Por exemplo,
o valor solid define uma linha sólida.
Vamos fazer, por exemplo, uma borda com espessura de 3
pixels, em forma de linha sólida, na cor vermelha:
<div id="elem"></div>
#elem {
border-width: 3px; /* espessura 3px */
border-style: solid; /* em forma de linha */
border-color: red; /* cor vermelha */
width: 300px;
height: 100px;
}
:
Nas próximas lições, vamos examinar o trabalho com bordas com mais detalhes.