<div id="nav">
<ul id="navbar">
<li><a class="icon img1" href="#">Item1</a></li>
<li><a class="icon img2" href="#">Item2</a></li>
<li><a class="icon img3" href="#">Item3</a></li>
</ul>
</div>
#navbar{
list-style-type:none;
}
#navbar li{
display:inline;
margin-right:16px;
}
a.img1{
background:url(http://www.sucai.com.cn/bizhi/flashAll/20111009/1318124792fVsTdB.jpg);
background-repeat: no-repeat;
background-size: 24px 24px;
background-position:0px center;
padding-left: 26px;
}
a.img2{
background:url("http://s9.knowsky.com/bizhi/l/20090606/oumeinvxinggaoqingbizhi%20(10).jpg");
background-repeat: no-repeat;
background-size: 24px 24px;
background-position:0px center;
padding-left: 26px;
}
a.img3{
background:url("http://1.bp.blogspot.com/_WU2wcpWvRPk/THCPQPNK7kI/AAAAAAAADqQ/QJ0YAZ32zYw/s1600/%E4%B8%96%E4%B8%8A%E6%9C%80%E6%80%A7%E6%84%9F%E7%9A%84%E5%A5%B3%E6%80%A7%E3%80%8D%E6%BD%94%E8%A5%BF%E5%8D%A1%C2%B7%E8%89%BE%E5%B7%B4+%E6%BD%94%E8%A5%BF%E5%8D%A1%C2%B7%E8%89%BE%E5%B7%B4.jpg");
background-repeat: no-repeat;
background-size: 24px 24px;
background-position:0px center;
padding-left: 26px;
}
External resources loaded into this fiddle: