Menu Fast (Aprimorado)

Yo galera como vão? Hoje estou trazendo o tão comentado menu Fast, porém eu uso um código aprimorado que eu aperfeiçoei do menu hover ele é mais fácil e melhor pra ser editado. Então aproveitem.

Primeiro passo.

Vai, no blogger, vá em Design, Editar HTML, procure pela tag:

]]></b:skin>

Acima dela cole este código CSS:

/* MENU2

----------------------------------------------- */

#menu2 {

font:14px Verdana, Arial, Helvetica, sans-serif;

}

#menu2 li {

list-style: none;

margin: 13px 0px 0px 5px;

padding: 0;

border: none;

font-size: 14px; 

}

#menu2 li a {

color: #ffffff;

padding-bottom: 5px;

padding-top: 5px;

padding-left: 10px;

padding-right: 10px;

margin-left:2px;

margin-right:2px;

background: #000;

text-shadow: 0px 0px 7px #CD5C5C;

border: 1px solid #dcdcdc;

-moz-border-radius-bottomleft: 6px;

-moz-border-radius-bottomright: 8px;

-moz-border-radius-topleft: 8px;

-moz-border-radius-topright: 8px;

-webkit-border-top-left-radius: 8px;

-webkit-border-top-right-radius: 8px;

-webkit-border-bottom-right-radius: 8px;

-webkit-border-bottom-left-radius: 8px;

background: url(LINK_DA_IMAGEM_NORMAL) repeat;

}

#menu2 li a:hover {

color: #ffffff;

padding-bottom: 5px;

padding-top: 5px;

padding-left: 10px;

padding-right: 10px;

margin-left:2px;

margin-right:2px;

background: #000;

text-shadow: 0px 0px 7px #CD5C5C;

border: 1px solid #dcdcdc;

-moz-border-radius-bottomleft: 6px;

-moz-border-radius-bottomright: 8px;

-moz-border-radius-topleft: 8px;

-moz-border-radius-topright: 8px;

-webkit-border-top-left-radius: 8px;

-webkit-border-top-right-radius: 8px;

-webkit-border-bottom-right-radius: 8px;

-webkit-border-bottom-left-radius: 8px;

background: url(LINK_DA_IMAGEM_HOVER) repeat;

}

Bom, em color é a cor do texto, fonte é o tamanho da letra, text-shadow é o efeito que se dá ao fundo da letra.

Bem essa parte é a mais fácil, você vai em Design, adicionar um gadget, HTML/JavaScript. E cole o código logo abaixo.

<div id="menu2">

<ul>

<li> <a href=" LINK_DO_POST " style="font-size: 100%;">Titulo 01</a>  <a href="  LINK_DO_POST  " style="font-size: 100%;"> Titulo 02</a> 

</li>

</ul>

</div>

Para adcionar mais um link basta duplicar o código abaixo:

 <a href="  LINK_DO_POST  " style="font-size: 100%;"> NOME_DO_POST  02</a> 

Quando forem duplicarem o código deixe um espaço entre os códigos para ele ficar em linha reta. 


Comentem avaliando. Valeu.