Hayo cupcakes, hoje trago um menu muito bonitinho para vocês. Ele e bem sutil e achei uma graça para quem quer ter um blog bem mimoso.
Códigos
.menusize {
display : block;
padding: 2px;
background: #BD9DDD;
text-indent : 5px;
padding-left: 6px;
vertical-align : middle;
margin-bottom: 2px;
-webkit-transition: all 0.60s;
}
.menusize:hover {
padding-left: 15px;
border-width: 1px;
border-style: left;
border-color: #3F0777;
box-shadow: inset 350px 0 0px 0 #D976A3;
-webkit-transition: all 0.30s;
}
display : block;
padding: 2px;
background: #BD9DDD;
text-indent : 5px;
padding-left: 6px;
vertical-align : middle;
margin-bottom: 2px;
-webkit-transition: all 0.60s;
}
.menusize:hover {
padding-left: 15px;
border-width: 1px;
border-style: left;
border-color: #3F0777;
box-shadow: inset 350px 0 0px 0 #D976A3;
-webkit-transition: all 0.30s;
}
Códigos
<div class="menusize"> <a href="URL"> Link 1 </a></div>
<div class= "menusize"> <a href="URL"> Link 2 </a></div>
<div class= "menusize"> <a href="URL"> Link 3 </a></div>
<div class= "menusize"> <a href="URL"> Link 4 </a></div>
<div class= "menusize"> <a href="URL"> Link 5 </a></div>
<br />
<div class= "menusize"> <a href="URL"> Link 2 </a></div>
<div class= "menusize"> <a href="URL"> Link 3 </a></div>
<div class= "menusize"> <a href="URL"> Link 4 </a></div>
<div class= "menusize"> <a href="URL"> Link 5 </a></div>
<br />
Nenhum comentário:
Postar um comentário