<p class="sycode"> <br> <br></p> <br><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <br><title>无标题文档</title> <br><style> <br />.div1{ width:420px;} <br />.div1 li { list-style: none; float:left; border:1px solid #EAF3FA; background:#FBFCFF; margin:10px; width:120px; height:40px; line-height:40px; padding-left:10px;} <br />.div span{padding-left:25px;/*空出16px来显示图标*/ <br /> height: 35px; /*设定好高度，让超出部分不可见*/ <br /> background:url(888888.png) no-repeat;/*所有的li共享一张图片*/} <br />.a{ background-position:-19px -22px; width:25px; height:20px;} <br />.b{ background-position:-146px -22px;width:25px; height:20px;} <br />.c{ background-position:-19px -68px;width:25px; height:25px;} <br />.d{ background-position:-146px -70px;width:25px; height:25px;} <br />.e{ background-position:-21px -120px;width:25px; height:25px;} <br />.f{ background-position:-145px -120px;width:25px; height:25px;} <br />.g{ background-position:-21px -120px;width:25px; height:25px;} <br />.h{ background-position:-21px -120px;width:25px; height:25px;} <br />.i{ background-position:-21px -120px;width:25px; height:25px;} <br /> <br /></style> <br> <br> <br> <br> <br><div class="div1"> <br><ul> <br> <li> <span class="a"></span><a href="#">aaaaa</a> </li> <br> <li> <span class="b"></span><a href="#">bbbbb</a> </li> <br> <li> <span class="c"></span><a href="#">ccccc</a> </li> <br> <li> <span class="d"></span><a href="#">ddddd</a> </li> <br> <li> <span class="e"></span><a href="#">eeeee</a> </li> <br> <li> <span class="f"></span><a href="#">eeeee</a> </li> <br> <li> <span class="g"></span><a href="#">eeeee</a> </li> <br> <li> <span class="h"></span><a href="#">eeeee</a> </li> <br> </ul> <br> </div> <br> <br> <br> <br> <br>
