domingo, 9 de setembro de 2012

Tutorial-Sidebar com efeito hover



o tutorial eu retirei desse site http://cherrycupcaskull.blogspot.com.br/ ,então vamos ao Tutorial ?

Primeiramente faça aquele esqueminha,va em Modelo e clike em Editar Html,depois de abrir vai parecer um tipo de advertencia e aperte prosseguir depois  aperte f3 ou crtl f e procure por:
/* Widgets.


Em baixo disso ira aparcer:
.sidebar .widget {

Abaixo do codigo acima vc ira colocar:
background: #CorDoFundo;
font-family: calibri; /*Mude a fonte conforme seu gosto*/font-size: 10px; /*Tamanho da fonte*/color: #CorDaFonte;padding: 10px; /*Não modifique aqui*/  border: 10px solid #CorDaBorda; /*Grossura da borda, que é sólida, a cor é você quem escolhe.*/border-radius: 5px 50px 5px 50px; /*Bordas arredondadas*/ -webkit-transition-duration: 1.50s; /*duração da transição*/ }


Abaixo desse codigo cole :
.sidebar .widget:hover {background:#CorDoFundoAoPassarOMouse;border: 10px solid #CorDaBordaAoPassarOMouse;border-radius: 50px 5px 50px  5px; /*Bordas arredondadas*/}

feito por B-LOVE-Anime do eternamente otaku

3 comentários:

Seja Bem vindo na página de comentários!
Por favor , não escreva palavrões e nem criticas ruins do blog ou qualquer outro blog,os comentários que quebrar as regras do blog,serão excluídos!E não se esqueça que como acabar de comentar coloque seu blog,e se n ter blog n tem problema, não precisa colocar...E siga o blog também antes de comentar...Se vc ter obedecido as regras,muito obrigada!
Bjos (My Cute Love Cupke)