mo_nav.html

<!-- html -->

<ul id="nav">
    <li class="option_one"><a href="">Option 1</li>
    <li class="option_two"><a href="">Option 2</li>
    <li class="option_three"><a href="">Option 3</li>
    <li class="option_four"><a href="">Option 4</li>
</ul>

<!-- css -->

ul#nav{
    float: left;
    clear: both;
    padding: 0;
    margin: 0;   
}

ul#nav li{
    float: left;
    clear: none;
    padding: 0;
    margin: 0;
}

ul#nav li a{
    display: block;
    text-indent: -9999px; /* -- this hides the text -- */
    float: left;
    clear: both;
}

ul#nav li.option_one{
    background: url(your-image) top left no-repeat;
    height: 10px; /* -- change this -- */
    width: 10px; /* -- change this -- */
}

/* -- 
repeat option_one class for all the other options 
make sure you use unique classnames otherwise they'll get overwritten
-- */