02/02/2013

Menu Roll Right


Ohayooo! Boa noite a todos, venho trazer mais um menu para vocês ele se chama "Roll Right", eu não tenho palavras para descrever ele de tão lindo que é. Eu já vi ele em outro blog, mas tive muita vergonha de perguntar e finalmente eu achei. \o/ Então trago ele agora para vocês, mas antes créditos de Worldesigns e ao KW.  Vamos ao tutorial agora?


1. Vá ate seu HTML, e procure por ]]></b:skin>, acima dele adicione:

Códigos
#menu{
background: url(http://static.tumblr.com/jyjxgdu/2Humbnktp/menu.png) right ;
width: 110px;
float: left;
height: 20px;
font: 20px Play;
color: #fff;
padding: 2px 0 6px 0;
text-align: center;border-radius: 7px;
margin: 5px;
text-transform: uppercase;
cursor: default;
-moz-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
#menu:hover {
opacity: .95;
background: url(http://static.tumblr.com/jyjxgdu/2Humbnktp/menu.png) left ;
 color: #5f5147;
}

2. Arrume a parte em negrito pelo o endereço da sua imagem, a mesma imagem tem que se repetir nos dois links. Salve é vá ate seu layout, então crie um gadget HTML/Javascript, dentro cole o código:

Códigos
<a href="link" id="menu">Link</a>

2 comentários:

  1. Bem legal o menu.Participa do meu mini-game?Beijos
    lembrando-carol.blogspot.com.br

    ResponderExcluir

Bem Vindos
Hi! Meu nome é Andréa Alark, mas conhecida como Wendy dona do blog Bunny Crazy. O blog foi criado em 2010 na intenção de ajudar a criação e desenvolvimento do seu blog. Aqui encontrará tutoriais e dicas de HTML, layouts gratuitos e muito mais.
Friends
Bunny Crazy by Wendy ❀
Bunny Crazy ★
Bunny Crazy ★
12345