Background gradiente

Oi gatas, tudo bom? Bom, o tuto de hoje é baseado no antigo layout blog Cherry Bomb (www), eu percebi que os gadjets, titulo do post e tudo mais, não eram feitos de imagens, mas sim de um código em html que permitia que as coisas, como os backgrounds fossem gradiente. Eu gamei naquilo! Comecei a vasculhar e tals, e consegui chegar ao grand finale! olha aí o resultado:

Bom, eu quis fazer um gradiente que não chamasse muita atenção, quis deixar um 'ar' de reflexo no topo do titulo... Bom, para vocês conseguirem este efeito,
Continue Lendo!





Bom, eu adorei esse código, salvou muito a minha vida,  Vamos lá, então?
Primeiro, você vai escolher duas cores, a de cima e a de baixo. Agora, procure no html do seu blog  h2 { e substitua o código background por este código:

background: #CIMA;
background: -moz-linear-gradient(top, #CIMA 1%, #BAIXO 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#CIMA), color-stop(100%,#BAIXO));
background: -webkit-linear-gradient(top,  #CIMA 1%,#BAIXO 100%);
background: -o-linear-gradient(top,  #CIMA 1%,#BAIXO 100%);
background: -ms-linear-gradient(top,  #CIMA 1%,#BAIXO 100%);
background: linear-gradient(to bottom, #CIMA 1%,#BAIXO 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CIMA', endColorstr='#BAIXO',GradientType=0 );

Onde está de lilás é a cor que você quer em cima, lembrando que todas as cores #CIMA devem ser iguais.
Onde está de rosa é a cor que você quer em baixo, que também todas as cores #BAIXO devem ser iguais.
Use esta tabela de cores (www) para procurar as suas favoritas.

Bom, é isso aí! se você quiser arredondar, use o seguinte código:

border-radius: 15px 15px 15px 15px;

O 1º 15px é a ponta esquerda de cima, o 2º é a ponta direita de cima, o 3º é a esquerda de baixo e o 4º é a ponta direita de baixo. Divirtam-se com os códigos! Lembrando que quanto maior o número, mais arredondado fica!

Espero que tenham gostado gente!

Beijos!

CRÉDITOS:  ROSA CHICLETE