CSS 17

W 
padding-left: Z 
 
BORDER-WIDTH 
Afeta a espessura da borda. 
border-width: X // Vale para as quatro 
border-width: X Y // Vertical; Horizontal 
border-width: X Y W Z // Sentido horário: top; right; bottom; left 
Podendo ser também: 
border-top-width: X // px | thin | medium | thick 
border-right-width: Y // px | thin | medium | thick 
border-bottom-width: W // px | thin | medium | thick 
border-left-width: Z // px | thin | medium | thick 
 
BORDER-COLOR 
Afeta a cor da borda. 
border-color: X // nome | RGB | Hexadecimal 
border-color: X Y // nome | RGB | Hexadecimal 
border-color: X Y W Z // nome | RGB | Hexadecimal 
 
Aplica-se as mesmas regras nos atributos anteriores: um, dois ou quatro valores. 
border-top-color: X 
border-right-color: Y 
border-bottom-color: W 
border-left-color: Z 
 
 
BORDER-STYLE 
Afeta o estilo da borda. 
border-style: X // none | dotted | dashed | solid | double | groove | ridge | inset | outset 
 
 
 
 Programação Web - CSS 
 
 
8
Para simplificar, pode-se adotar a seguinte regra para as bordas: 
border: X Y X // Sendo X, Y e Z valores do border-width, border-color e 
 // border-style, e não necessários sempre nesta mesma ordem. 
 
WIDTH E HEIGHT 
Afeta a largura e a altura do bloco, respectivamente. 
width: X // largura em px ou % 
height: X // altura em px ou % 
 
FLOAT 
Posiciona o bloco a direita ou esquerda e faz com que o texto ao redor flutue em sua volta. 
float: X // Sendo X igual a ‘left’ ou ‘right’. 
 
POSICIONAMENTO 
Posiciona o bloco ou outro elemento na tela. 
position: X // absolute | relative 
top: X // px | % 
left: X // px | % 
 
O valor “absolute” posiciona no canto superior esquerdo da tela. Já o “relative”, refere-se à 
posição anterior do elemento. 
 
EFEITOS DE LINKS 
A:active{} // é um link ativo no documento 
A:hover{} // é quando o mouse passa por cima de um link 
A:link{} // é um link 
A:visited{} // é quando um link já foi visitado 
 
EXERCÍCIO 
Crie um documento HTML que utilize todas as regras.