Para começar acesse: Painel de Controle > Design > e clique em Editar Html.
Em seguida localize o trecho:
O que nos interessa no momento é a parte em negrito, que deverá ser substituída pelo código a seguir:
body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
Onde:
background:#FFFFFF url("Endereço da imagem")
top repeat-x fixed;
#FFFFFF = cor de fundo;
url("Endereço da imagem") = endereço da imagem (oh!);
top= é a posição da imagem;
repeat-x = indica que a imagem irá repetir horizontalmente;
fixed = mantem a imagem fixa na página mesmo com o rolamento da mesma.
» Exemplo 1, degradê horizontal:
body {
background:#FFFFFF url("http://lh4.ggpht.com/_gkCCEPUJN58/TDPHpL6QyKI/AAAAAAAABBU/NPdTPCr2WZ8/02.png") top repeat-x fixed;
margin:0;
...
...
}
» Exemplo 2, degradê vertical(repeat-y), partindo da esquerda(left) para o centro:
Fácil não?
body {
background:#000000 url("https://lh4.googleusercontent.com/_gkCCEPUJN58/TW5dFiezkNI/AAAAAAAABXw/VftXI7m7-iI/01.png") left repeat-y fixed;
margin:0;
...
...
}
Essa dica foi baseada no tutorial do Maujor em: http://maujor.com/dicas/bgdegrade.php
0 comentários