标准CSS 列表写法

前台的HTML代码如下: 

                         <div class="last">
                                  
                                  <span class="title">专题教程</span>
                                        
                                         <ul>
                                              <li><a href="#">Lightroom专题集</a></li>
                                              <li><a href="#">非主流照片教程集</a></li>
                                              <li><a href="#">艺术照片效果教程</a></li>
                                              <li><a href="#">新照旧照老残效果</a></li>
                                              <li><a href="#">PhotopsCS3专题集</a></li>
                                              <li><a href="#">Photoshop调出美女照片纯</a></li>
                                              <li><a href="#">Photoshop为婚片打造出华丽的金色效果</a></li>
                                              <li><a href="#">照片色调教程专辑</a></li>
                                              <li><a href="#">照片边框效果教程</a></li>
                                              <li><a href="#">PS打造出MM照片的柔软淡色艺术效果</a></li>
                                         </ul>
                          </div>
                          <!-- *******************正文内容 .last******************* -->


CSS代码
* {
    margin:0px;
    padding:0px
}
html,body {
           font-family:Arial, Helvetica, sans-serif;
           font-size:12px;
}
span {
         font-size:14px; font-weight:bold; color:#000;
}                

ul , ol {
         list-style:none;
         margin:0px;
         padding:0px;
}
li {
        display:block;
        float:left;
}
a {
        text-decoration:none;
}
a:hover {
        text-decoration:underline; color:#000
}


.last {
       300px;
       overflow:visible;
       border:1px solid #A2B7DB;
       float:left;
       margin-top:5px
}
.last span.title {
                 display:block;
                 100%;
                 height:29px;
                 background:url(../image/title_b_bg.gif) repeat-x;
                 line-height:29px;
}
.last span {text-indent:10px; color:#10326B; font-weight:bold}
.last ul {
           clear:both;
}
.last li {
           height:20px;
           290px;
           background:url(../image/ico-2.gif) 5px 8px no-repeat ;
           border:1px dashed #FAFAFA;
          }
.last li a {
          color:#10326B;
          padding-left:30px;
}
.last li a:hover {
               color:#FF3300;
}

效果图如下:

转贴:http://www.xzitb.com/read.php?tid=127

原文地址:https://www.cnblogs.com/smallfa/p/1611300.html