وم سوف نقوم بإنشاء قائمة جاهزة

<nav  id="menu" class="nav">
    <ul>
        <li>
            <a  href="#" title="">
                <span  class="icon"> <i aria-hidden="true"  class="icon-home">≡</i></span><span>Home</span>
            </a>
        </li>
        <li>    
          <a href="#" title=""><span class="icon"> <i aria-hidden="true" class="icon-services">♥</i></span><span>Services</span></a> 
        </li>
        <li>
            <a  href="#" title=""><span  class="icon"><i  aria-hidden="true" class="icon-portfolio">•</i></span><span>Portfolio</span></a>
        </li>
        <li>
            <a  href="#" title=""><span  class="icon"><i  aria-hidden="true" class="icon-blog">♦</i></span><span>Blog</span></a>
        </li>
        <li>
            <a  href="#" title=""><span  class="icon"><i  aria-hidden="true" class="icon-team">♣</i></span><span>The  team</span></a>  
        </li>
        <li>
            <a  href="#" title=""><span  class="icon"><i  aria-hidden="true" class="icon-contact">♠</i></span><span>Contact</span></a>
        </li>
    </ul>
</nav>