How to: Create a simple horizontal menu

Required files:
  • Lists.css

A simple document object model is one of the key concepts of a high quality web page. In this example we will make a horizontal main menu.

Here is the code:
<ul id="MainMenu" class="HorizontalList NoListStyle">
    <li><a href="/Default.html">Home</a></li>
    <li><a href="/Products.html">Products</a></li>
    <li><a href="/Support.html">Support</a></li>
    <li><a href="/Contact.html">Contact</a></li>

Now the MainMenu displays its items horizontally and you only have to write the significant styles for the menu items.

Last edited Dec 23, 2009 at 8:15 PM by BlueCode, version 1


No comments yet.