CSS Menus - CSS templates for websites
- HTML: "UL LI" elements
- Pure CSS. No Javascript.
- The menu item that matches the current page URL need to be set as class="current"
- Supported by all major browsers
IE 6.0+, Firefox 1.5+, Chrome 1.0+, Safari 3+, Opera 9.0+, Netscape 7.0+
CSS Menu Templates
Souce Code
HTML Code CSS background image
Souce Code
HTML Code CSS bg.gif bg2.gif
Souce Code
HTML Code CSSSouce Code
HTML Code CSS background image
Souce Code
HTML Code CSS<ul class="menu1">
<li><a href="#1">CSS</a></li>
<li><a href="#2" class="current">CSS Menus</a></li>
<li><a href="#3">Menu</a></li>
<li><a href="#4">Single Level</a></li>
<li class="lastItem"><a href="#5">CSS Menu</a></li>
</ul>
<div class="menu2">
<a href="#1">CSS</a>
<a href="#2" class="current">CSS Menus</a>
<a href="#3">Menu</a>
<a href="#4">Single Level</a>
<a href="#5">CSS Menu</a>
<a class="dummy"> </a>
</div>
<div class="menu3">
<a href="#1">CSS</a>
<a href="#2" class="current">CSS Menus</a>
<a href="#3">Menu</a>
<a href="#4">Single Level</a>
<a href="#5">CSS Menu</a>
</div>
<div class="menu3sub"> </div>
<div class="menu4">
<a href="#1"><span>CSS</span></a>
<a href="#2" class="current"><span>CSS Menus</span></a>
<a href="#3"><span>Menu</span></a>
<a href="#4"><span>Single Level</span></a>
<a href="#5"><span>CSS Menu</span></a>
</div>
<div class="menu4sub"> </div>
<div class="menu5">
<a href="#1">CSS</a>
<a href="#2" class="current">CSS Menus</a>
<a href="#3">Menu</a>
<a href="#4">Single Level</a>
<a href="#5">CSS Menu</a>
</div>