HTML
-
<div id=”tabMenu”>
-
<ul class=”topnev”>
-
<li><a href=”#” class=”active”>CSS MENU</a></li>
-
<li><a href=”#”>CSS MENU 2</a></li>
-
<li><a href=”#”>CSS MENU </a></li>
-
<li><a href=”#”>CSS MENU</a></li>
-
<li><a href=”#”>CSS MENU</a></li>
-
<li><a href=”#”>CSS MENU</a></li>
-
</ul>
-
</div>
CSS
-
<style>
-
#tabMenu {
-
background:#000000;
-
margin:10px 0 0 0;
-
padding:5px 0 0 50px;
-
}
-
ul.topnev {
-
margin:0;
-
padding:0;
-
list-style:none;
-
border:#000;
-
}
-
ul.topnev li {
-
margin:0;
-
padding:0;
-
list-style:none;
-
display:inline;
-
}
-
ul.topnev li a {
-
padding:10px;
-
font:bold 12px/34px Tahoma, Arial, Helvetica, sans-serif;
-
text-decoration:none;
-
color:#FFF;
-
}
-
ul.topnev li a:hover {
-
background:#FFF;
-
color:#3e3a3a
-
}
-
ul.topnev li a.active {
-
background:#FFF;
-
color:#3e3a3a
-
}
-
</style>
Khả năng tương thích html Menu Horizontal của trình duyệt
Download Source: html menu horizontal