Boas noites o domingo está caminhando para final,bem eu venho trazer um novo modelo de menu.
É um menu com submenu têm hover no menu e no submenu ,como pode ver na imagem acima é assim irá ficar.
Mas pode visualizar online:  ENTRE AQUI...
Como pode visualizar viu o efeito hover dele ,não ligue para sitio onde eu coloquei o menu é só para visualização nada mais ...
Entre no seu painél do blog e depois em esquema e adicione um gadget html/javascript;
E cole meu código ;



<style>
.simplesmenu-bt{background:-webkit-gradient(radial, 165 0, 0, 220 -257, 465, from(#8664CD), to(#b0e2ff));font:16px oswald;text-transform:uppercase;display:inline-block;width:100%;margin-bottom:-8px;border-bottom:solid 5px #000000;}
.simplesmenu-bt ul{width:970px;padding:0;margin:0 auto;}
.simplesmenu-bt li{list-style-type:none;display:inline-block;float:left;}
.simplesmenu-bt li a{color:#000;display:block;font-size:18px;position:relative;text-decoration:none;text-shadow:1px 1px 1px #fcfcfc;padding:6px 10px 6px 10px;border-left:1px solid #E5E4E0;border-right:1px solid #E5E4E0;}
.simplesmenu-bt li a:hover{background:#fbaed2;color:#fff;}
.simplesmenu-bt li a .sf-sub-indicator{overflow:hidden;position:absolute;text-indent:-9999px}
.simplesmenu-bt li li a,.simplesmenu-bt li li a:link,.simplesmenu-bt li li a:visited{background:-webkit-gradient(radial, 165 0, 0, 220 -257, 465, from(#8664CD), to(#b0e2ff));border-bottom:1px solid #E5E4E0;color:#000;font: 14px PT Sans Narrow;position:relative;text-transform:none;width:138px;padding:10px 13px;}
.simplesmenu-bt li li a:hover,.simplesmenu-bt li li a:active{background:#fbaed2;color:#fff;}
.simplesmenu-bt li ul{height:auto;left:-9999px;position:absolute;width:160px;z-index:9999;margin:0}
.simplesmenu-bt li ul a{width:140px}
.simplesmenu-bt li ul ul{margin:-33px 0 0 157px}
.simplesmenu-bt li:hover>ul,.masmenu li.sfHover ul{left:auto}
</style>
<div class='simplesmenu-bt'>
<ul class='bt-menu'>
<li><a href='/'>Inicio</a></li>
<li><a href='#'>Best-tuga 1</a>
<ul>
<li><a href='#'>Best-tuga 1</a></li>
<li><a href='#'>Best-tuga 1</a></li>
<li><a href='#'>Best-tuga 1</a></li>
</ul>
</li>
<li><a href='#'>Best-tuga 2</a>
<ul>
<li><a href='#'>Best-tuga 2</a></li>
<li><a href='#'>Best-tuga 2</a></li>
<li><a href='#'>Best-tuga 2</a></li>
</ul>
</li>
<li><a href='#'>Best-tuga 3</a>
<ul>
<li><a href='#'>Best-tuga 3</a></li>
<li><a href='#'>Best-tuga 3</a></li>
<li><a href='#'>Best-tuga 3</a></li>
</ul>
</li>
<li><a href='#'>Best-tuga 4</a>
<ul>
<li><a href='#'>Best-tuga 4</a></li>
<li><a href='#'>Best-tuga 4</a></li>
<li><a href='#'>Best-tuga 4</a></li>
</ul>
</li>
<li><a href='#'>Menu 3</a></li>
</ul>
</div>

Nota; onde diz best-tuga coloque nome quiser...
onde tem este sinal  #  coloque seu link...

Foi esta a partilha que trouxe ,talvez última de hoje .até feliz domingo...

 
 
Back to top

Estatísticas

  • Postagens
  • Comentários
  • Visualizações
🔗 Contato✔ Apoio 🔗
Reservado © 2016 ❝ Autôr