11/11/2012

Navegação personalizada com efeito Degradê

Gente desculpa , eu quase sai do Sweet Land sério quase chorei , então hoje trago um tutorial de como personalizar a navegação do blog , veja um exemplo 


gostou ? então leia mais
Dê F3 e procure por #blog-pager { e acima dessa tag cole o seguinte código

  /* Navegação com efeito hover degradê - http://goimagines.blogspot.com.br */#blog-pager {clear:both;text-align: center;margin:0px auto;padding:10px;}#blog-pager a:link, #blog-pager a:visited{color: #ffffff/* cor da fonte */ font-size: 16px; /* tamanho da fonte */ padding:5px;background-color: #8BC2C9/* cor do fundo */ -moz-border-radius:10px; /* bordas arredondas, apague se não quiser */ -khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;}#blog-pager a:hover{color: #ffffff/* cor da fonte hover*/ padding:5px;background: #BFCED5/* fundo hover, apague o código abaixo até } se não quiser degradê */ background: -webkit-gradient(linear, left top, left bottom, from(#BFCED5), to(#8BC2C9));/* webkit browsers */background: -moz-linear-gradient(top, #BFCED5#8BC2C9);/* firefox3.6+ */filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#BFCED5', EndColorStr=' #8BC2C9');/* IE */}#blog-pager-newer-link {float: left;}#blog-pager-older-link {float: right;}

Créditos Go Imagines


5 comentários:

  1. Nossa muito legal essa tuto ,eu tava feito louca procurando esse tuto .

    algodaodoceteen.blogspot.com.br

    ResponderExcluir
  2. fica lindo né?! amo esse efeito nunca usei no meu blog, mais acho lindo, mais prefiro usar o efeito hover das imagens que tbm fica massa ^_^

    ResponderExcluir
  3. queria desculpa em me meter mais cade o créditos ao go imagine ?

    ResponderExcluir
    Respostas
    1. Está ali em cima fofo ^-^

      Excluir
    2. Logo depois do último código está escrito CRÉDITOS GO IMAGINE :) beijão

      Excluir