Tutorial : Navigation 3

Assalamualaikum



hari ni nina nak share dgn korang navigation ni... navigation ni boleh dikira popularlah jugak .. jom start


live preview




HOME ABOUT LINKIES FOLLOW DASHBOARD


  • copy code kat bawah
  • Template Designer : Dashboard > Layout > Add a Gadget > Paste dlm HTML/JavaScript
  • Blogskin/ Template Classic : paste code ni dibawah code </style>
<style>
a.luhan {
letter-spacing:1px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out; width:80px;
display:inline-block;
background:#F7F7F7;
color:#999;
border-left:solid 5px #E9ECFF;
cursor:vertical-text;
font:10px calibri;
padding:5px;
text-transform:uppercase;
text-align:center;
letter-spacing:1px;
text-decoration:none;
}
a.luhan:hover{
border-left:2px solid #F7F7F7;
background:#E9ECFF;
padding-right:10px;
width:80;
}
</style>
<a class="luhan" href="/">HOME</a>
<a class="luhan" href="/">ABOUT</a>
<a class="luhan" href="/">LINKIES</a>
<a class="luhan" href="/">FOLLOW</a>
<a class="luhan" href="/">DASHBOARD</a></div>
</div>
Take note!!!
Red : Link
Blue : Title Page
Purple : Background


Share this:

CONVERSATION

0 Comments:

Post a Comment