Estilizando formulrio com folhas

de estilo
Profa:. Priscila Giavaroto
priscilagiavaroto@gmail.com
 Pgina formulario.html

Criando estrutura bsica do doc html, adicionando o

arquivo estilo.css que ser criado posteriormente.
Trabalharemos com alinhamento em
div e atribuiremos seu id = area.
Este ser trabalhado posteriormente
no estilo.css
 Incio do formulrio, definio de
mtodo de envio e abertura das tags
rea de campos (inputs) e legenda.
 Abertura das tags de rtulo e
respectivos inputs de texto, senha e
rea de texto com atribuio das
classes posteriormente estilizadas:
nome, password e msg
 A pgina estilo.css
Classe area (relativa div criada anteriormente)

Position: Pode ser relative, fixed ou absolute

Width: Largura
Height: Altura
 rea dos campos de formulrio

Esta por sua vez recebe a cor de fundo cinza, e tem sua largura e
comprimento estipulados atravs dos atributos height e width
 Legenda do formulrio

Tem sua letra em negrito, famlia da fonte pr-

definida e seu tamanho igual a 20.
 Formatao dos rtulos
Nome, Senha e Obs.
Estes por sua vez, tem seu alinhamento definido atravs das
propriedades de margem left (esquerda) e right (direita) e sua
fonte no tamanho 17.
 Incio da formatao dos inputs
(Campo Nome)

Este tem sua cor de fundo preta, alinhamentos de margem em

relao ao topo, esquerda e largura pr-definida, bem como a
cor da fonte.
 Input de senha (Campo senha)
Basicamente, as mesmas propriedades estabelecidas
no input Nome
rea de texto
Por fim, a estilizao do boto Enviar
Estilo de borda: Pontilhada
Margem inferior: 0
Distncia margem superior: 135
Cor de fundo: Preto
Fonte: Branca
Resultado: