The menu

Setup the HTML for your menu like you normally would, using UL, LI and A elements.

<ul>
   <li><a href="/">Home</a></li>
   <li><a href="/about/">About us</a></li>
   <li><a href="/contact/">Contact</a></li>
</ul>

Make sure to wrap the text in either an A or a SPAN element.

Wrap it in a node

Wrap the entire UL in a node (most commonly a NAV element) and give that node an ID.

<nav id="my-menu">
   <ul>
      <li><a href="/">Home</a></li>
      <li><a href="/about/">About us</a></li>
      <li><a href="/contact/">Contact</a></li>
   </ul>
</nav>

Submenus

You can create a submenu by simply putting another UL in a LI.

<nav id="my-menu">
   <ul>
      <li><a href="/">Home</a></li>
      <li><a href="/about/">About us</a>
         <ul>
            <li><a href="/about/history/">History</a></li>
            <li><a href="/about/team/">The team</a></li>
            <li><a href="/about/address/">Our address</a></li>
         </ul>
      </li>
      <li><a href="/contact/">Contact</a></li>
   </ul>
</nav>

Next up:
Styling lists