Tutorial - Menu navbar

Olá leitores >3<

Como passaram o natal? Pra mim foi bom, além de ter comido bastante, ainda ganhei bastante presente, o que é bom, já que eu só ganho presente no meu aniversário ou dia das crianças askjaskdjaskdjalksjdlaksjd. Enfim, terminamos a maratona de packs, seriam 6 packs mas, eu decidi não postar o layout que seria o post de número 6, sendo que,  a maioria das pessoas não usariam o layout, e só serviria como mais um post do blog (eu acho q), então vamos deixá-lo para outra ocasião. Falando em layout, eu estou pretendendo trocar o do blog. Veio algumas ideias novas na minha cabeça e eu pretendo colocar em prática e ver se sai um layout bonito e descente AUSHAUSHAUSHAUSHA', vamos ao post. 

Finalmente, depois de tantos dias, eu resolvi postar o tutorial do menu navbar que é esse que eu uso no topo do blog e que muita gente pediu (e quando eu digo muita, é muita mesmo q). Eu só não postei esse tutorial antes porque, esse menu foi postado lá no finado Kawaii World, porém como a dona Clara fechou, então tive que copiar do meu e alterar algumas coisas, como as cores e o tamanho do menu, já que para cada blog, o tamanho pode diferenciar, dependendo do tamanho do blog ao todo q. Eu espero que vocês tenham se contentado e parem de ficar pedindo coisas do meu layout atual, assim que eu trocar ele, tento postar algumas coisas que dê para vocês usarem em seus blogs. Como antigamente, vamos ao tutorial ~

Acima de ]]></b:skin> cole: 

.bar_top {
width: 100%;
height: 31px;
background: #47a9d7; /* cor do fundo */
}
.menu_barrax {
float: center;
margin: 0;
padding: 0;
}
.menu_barrax li {
float: left;
list-style: none;
font-size: 10px;
font-weight: bold;
font-family: Verdana, Arial;
text-transform: uppercase;
border-right: 4px none #dddddd; /* deixe essa cor */
margin: 0 0 0 10px;
padding: 9px 0px 0px 0px;
text-shadow:0 1px #267ca4;  /* sombra das letras */
}
.menu_barrax li a{
background: #47a9d7;  /* cor do fundo, deixe a mesma que o de cima */
padding: 10px;
color: #fff;  /* cor da letra*/
text-decoration: none;
-webkit-transition:all 0.4s ease;
-o-transition:all 0.4s ease;
-moz-transition:all 0.4s ease;
transition:all 0.4s ease;
}
.menu_barrax li a:hover {
text-decoration: none;
color: #4aaddc;  /* cor da fonte em hover*/
background: #1b93cd;  /* cor do fundo em hover */
-webkit-transition:all 0.4s ease;
-o-transition:all 0.4s ease;
-moz-transition:all 0.4s ease;
transition:all 0.4s ease;
text-shadow:0 1px #0d1c27;  /*cor da sombra do texto em hover */
}
.transit {
-webkit-transition:all 0.4s ease;
-o-transition:all 0.4s ease;
-moz-transition:all 0.4s ease;
transition:all 0.4s ease;
}
.bar_topd {
width: 900px;
margin: 0 auto;
}

Agora procure por </head>, quando achar cole: 

<center>
<div class='bar_top'>
<div class='bar_topd'>
<ul class='menu_barrax'>
<li><a href='SEU LINK' title='Volte para a homepage'>Inicio</a></li>
<li><a href='SEU LINK' title='TITULO'>NOME</a></li>
<li><a href='SEU LINK' title='TITULO'>NOME</a></li>
<li><a href='SEU LINK' title='TITULO '>NOME</a></li>
<li><a href='SEU LINK' title='TITULO'>NOME</a></li>
<li><a href='SEU LINK' title='TITULO'>NOME-</a></li>
</ul></div></div></center>

Agora é só personalizar de acordo com o seu gosto ;3