Minggu, 07 Agustus 2011

Cara Membuat Menu Bar

/* tab navigasi */
ul. nav {list-style:none; background:none; padding:0; margin-left:0; border-top:1px solid #ccc; border-bottom:3px double # ccc;}
.nav li {border-right:1px solid #DDD; float:left; display:block; width:100px;}
.nav li a {font-size:11px; outline:none; color:#999; text-decoration:none; display:block; padding:5px 0 8px 5px; width:99px; text-transform:uppercase;}
.nav li a span{font-size:11px; color:#999; text-transform:lowercase;}
.nav li a: hover {background:# EFEFEF; color:#ccc !important; width:95px;}
* html .nav li a: hover {background:# fff; width:99px;}
.nav li. skip {border-left:1px solid #DDD; float:right; display:block; width:100px; padding-right:5px; border-right:none;}
.nav
li.skip a{width:100px;}
li. top {border-left:1px solid #DDD;
float:right;
display:block;
width:100px;
padding-right:5px;
border-right:none;}
li.top a {width:100px;}
.nav li.skip a:hover, li.top a:hover {background:transparent;
color:#fff !important;}
.fix: after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.fix {display:inline-block;}
* html
.fix {height:1%;}
.fix {display:block;}


<div class='nav'>
<ul class='nav-fix'>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='url yang dituju'>teks tampilan</a></li>
<li><a href='url yang dituju'>teks tampilan</a></li>
</ul>
</div>

Tidak ada komentar:

Posting Komentar