Os seguintes atributos css são utilizados para a formatação de fundo dos elementos html.
background-color: Define a cor de fundo de um elemento.
Valores: Nome da cor em inglês (Ex: "yellow") ou sua numeração hexadecimal precedida de "#" (Ex: "#000000")
Uso: "background-color: #FFFFFF;" ou "background-color: red;"
Valores: Nome da cor em inglês (Ex: "yellow") ou sua numeração hexadecimal precedida de "#" (Ex: "#000000")
Uso: "background-color: #FFFFFF;" ou "background-color: red;"
background-image: Define uma imagem como fundo de um elemento.
Valores: Endereço da imagem dentro dos parênteses do texto "url()". Assim como no html podemos utilizar ../ para voltar um nível acima no diretório ao definirmos o endereço da imagem.
Uso: "background-image: url(minha_imagem.jpg);"
Valores: Endereço da imagem dentro dos parênteses do texto "url()". Assim como no html podemos utilizar ../ para voltar um nível acima no diretório ao definirmos o endereço da imagem.
Uso: "background-image: url(minha_imagem.jpg);"
background-repeat: Define se a imagem de fundo vai repetir ou não e a direção da repetição. Este atributo só deve ser utilizado quando definimos uma imagem de fundo a um elemento através da propriedade "background-image"
Valores: "repeat", "repeat-x", "repeat-y" ou "no-repeat"
Uso: "background-repeat: repeat-x;"
Valores: "repeat", "repeat-x", "repeat-y" ou "no-repeat"
Uso: "background-repeat: repeat-x;"
background-attachment: Define se a imagem de fundo de um elemento ficará fixa ("fixed") ou se irá rolar junto com o conteúdo("scroll"). Este atributo só funciona se utilizado para a tag "body", ele também só deve ser utilizado quando definimos uma imagem de fundo através da propriedade "background-image"
Valores: "scroll" ou "fixed"
Uso: "background-attachment: fixed;"
Valores: "scroll" ou "fixed"
Uso: "background-attachment: fixed;"
background-position: Define o alinhamento da imagem de fundo de um elemento. Este atributo só deve ser utilizado quando definimos uma imagem de fundo a um elemento através da propriedade "background-image"
Valores: "top left", "top center", "top right", "center left", "center center", "center right", "bottom left", "bottom center" ou "bottom right"
Uso: "background-position: bottom right;"
Valores: "top left", "top center", "top right", "center left", "center center", "center right", "bottom left", "bottom center" ou "bottom right"
Uso: "background-position: bottom right;"
Exercício:
Utilizando as propriedades css para formatação de fundos em elmentos HTML faça a página abaixo:
Baixe aqui a imagem utilizada no exercício.
Baixe aqui a imagem utilizada no exercício.

0 comentários:
Postar um comentário