Home Questions Themes Extras Tutorials
Menu com borda lateral:

É esse menu abaixo, essa é a forma mais simples dele, você pode configurar as bordas como quiser, colocar em qualquer um dos 4 lados:
image

1- Primeiro, cole o código abaixo no seu CSS, ou seja, entre <style> e </style>:

.menu {display: inline-block; font-size: 10px; font-family: verdana;
background-color: #COR DO FUNDO; text-transform: uppercase; 
padding: 2px 5px; color: #COR DA FONTE; letter-spacing: 1px; 
margin-bottom: 3px; border-left: TAMANHO DA BORDApx solid 
#COR DA BORDA; -webkit-transition: all 0.4s ease-out; 
-moz-transition: all 0.4s ease-out; text-shadow: 0px 1px 1px #fff; width:66px;
 text-align:left;}

.menu:hover{background-color: #COR DO FUNDO; color: #COR DA FONTE;
border-left: TAMANHO DA BORDApx solid #COR DA BORDA; 
padding-right: 12px; text-align: right;-webkit-transition: all 0.4s ease-out;
 -moz-transition: all 0.4s ease-out;}

Agora, é simples, cole o código abaixo onde quer que o menu apareça:
Para falso-iframe:

<span id="menu" onclick="changeNavigation('ID DO IFRAME')">
<div class="menu">Titulo</div></span>

Para links:

<a href="LINK" class="menu">Titulo</a>

- Tutorial por Luana (YouMakeMeCrazierBaby)
Não reblogue ou copie. Qualquer desrespeito as regras será denunciado sem aviso prévio.



Página 1 de 1