Menu destaque

Trouxe para vocês um menu super fofo, ele está em vários blogs e tumblr de tutoriais.

Para ver o menu destaque clique aqui

Para colocar em seu blog copie o código abaixo e coloque antes da tag ]]></b:skin>

.destaque  {
float: right;
margin-right: -10px;
margin-top: -5px;
background: url('http://i765.photobucket.com/albums/xx293/Claudinenetto/Menus/Menu%20Destaque/destaque-7.png');
background-repeat: no-repeat!important;
width: 64px;
height:25px;
}
.boxdestaque:hover .destaque {
background-position: -0px -25px;
}
.boxdestaque {
text-align: left;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
margin-right: 7px;
background: #DEC8FF;
padding: 5px;
margin-bottom: 2px;
}
.boxdestaque:hover {
background: #DBC8FF;
text-shadow: 1px  1px 1px #fff;
}
.boxdestaque .title {
color: #763DD5;
font-size: 11px;
font-weight:none;
font-family: Georgia;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.boxdestaque:hover .title{
color: #8E7AAC;
padding-left: 15px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}

background: url('http://i765.photobucket.com/albums/xx293/Claudinenetto/Menus/Menu%20Destaque/destaque-7.png'); -Troque pela url do seu botão.

width: 64px; - Largura do botão.
height: 25px; - Altura do botão.

background: #DEC8FF; - Cor do fundo sem passar o mouse.

background: #DBC8FF;  - Cor do fundo ao passar o mouse.

color: #763DD5;  - Cor da letra sem passar o mouse.

color: #8E7AAC;  - Cor da letra ao passar o mouse.

font-size: 11px; - Tamanho da letra.

font-family: Georgia; - Nome da fonte.

Personalize a seu gosto.

Após personalizar, coloque no gadget html/java script o código

<div class="boxdestaque">
<span class="title">Título da postagem
<a class="destaque" href="LINK DO POST"></a>
</span>
</div>

<div class="boxdestaque">
<span class="title">Título da postagem
<a class="destaque" href="LINK DO POST"></a>
</span>
</div>

<div class="boxdestaque">
<span class="title">Título da postagem
<a class="destaque" href="LINK DO POST"></a>
</span>
</div>

Repita se você quiser mais caixinhas, mas repita o código todo.

Ex:

 

<div class="boxdestaque">

<span class="title">Título da postagem

<a class="destaque" href="LINK DO POST"></a>

</span>

</div>

Algumas imagens para menu destaque