CSS Menus - CSS templates for websites

  • HTML: "UL LI" elements (SEO-friendly)
  • 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 cross browser
    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
 
CSS CSS Menus Menu Single Level CSS Menu  

Souce Code

HTML Code         CSS
CSS CSS Menus Menu Single Level CSS Menu
 

Souce Code

HTML Code         CSS
CSS CSS Menus Menu Single Level CSS Menu
 

Souce Code

HTML Code         CSS

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>


Ask Questions / Leave a Comment

Question Title:
Your name:
+ =