terça-feira, 23 de novembro de 2010

Colocar fundo degradê na página

Vou mostrar como construir o fundo degradê usando o Fireworks.

Use o seu editor preferido.

1-) Abra o FW e tecle Ctrl + N para abrir um novo documento;

2-) Ajuste as dimensões do palco para 10px x 700px e cor transparente;

Screenshot do painel Fireworks para ajuste de canvas

1-) Desenhe um retângulo com as dimensões do palco e aplique o preenchimento degradê;

Screenshot do painel Fireworks para ajuste de degrade

Ajuste o degradê e salve com a extensão .jpg

Neste tutorial salvei como bgdegrade.jpg

Imagem degrade pronta

Esta é a regra CSS que coloca o degradê como fundo da página:

Nota: Defina também uma cor para o fundo que ofereça contraste com os textos na página, pois se por acaso a imagem do fundo não for carregada no browser do usuário você garantirá a legibilidade da página.
Imagine um fundo degradê em cor escura onde você projetou textos em cor branca. Se a imagem de fundo não for carregada o fundo assumirá uma cor clara (em geral branca) e os textos ficarão invisíveis.
Nesta dica adotei a cor alternativa para o fundo #02CBFF (azul claro)

0 comentários:

Postar um comentário

 
Design by Eddy Oliveira