树型列表的实现

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd" >
< html >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
< title > 树型列表的实现 </ title >
< style  type ="text/css" >
<!--
ul.tree, ul.tree ul {}{
     list-style-type: none;
   }
      ul.tree, ul.tree ul {}{
     list-style-type: none;
     background: url(http://www.ximicc.com/attachments/month_0803/42008320133339.jpg) repeat-y;
     margin: 0;
     padding: 0;
   }
   
   ul.tree ul {}{
     margin-left: 10px;
   }

   ul.tree li {}{
     margin: 0;
     padding: 0 12px;
   }
      ul.tree, ul.tree ul {}{
     list-style-type: none;
     background: url(http://www.ximicc.com/attachments/month_0803/42008320133339.jpg) repeat-y;
     margin: 0;
     padding: 0;
   }
   
   ul.tree ul {}{
     margin-left: 10px;
   }

   ul.tree li {}{
     margin: 0;
     padding: 0 12px;
     line-height: 20px;
     background: url(http://www.ximicc.com/attachments/month_0803/n200832013377.jpg) no-repeat;
     color: #369;
     font-weight: bold;
   }
      ul.tree li.last {}{
     background: #fff url(http://www.ximicc.com/attachments/month_0803/0200832013458.jpg) no-repeat;
   }
-->
</ style >
</ head >

< body >
    < ul  class ="tree" >
     < li > Animals
      < ul >
       < li > Birds </ li >
       < li > Mammals
        < ul >
         < li > Elephant </ li >
         < li  class ="last" > Mouse </ li >
        </ ul >
       </ li >
       < li  class ="last" > Reptiles </ li >
      </ ul >
     </ li >
     < li  class ="last" > Plants
      < ul >
       < li > Flowers
        < ul >
         < li > Rose </ li >
         < li  class ="last" > Tulip </ li >
        </ ul >
       </ li >
       < li  class ="last" > Trees </ li >
      </ ul >
     </ li >
    </ ul >
</ body >
</ html >

原文来自：http://www.ximicc.com/article.asp?id=87