用CSS中的分层列表制作表

你可以用一些浮点数和绝对定位来完成这个任务。

ul li { list-style-type: none; display: inline; float: left; margin: 0 4px;}
ul.first {position: absolute; top: 0; left: 0;}
ul li ul li ul{ list-style-type: none; display: inline; float: left;position: absolute; top: 30px; left: 0; margin-top: 30px;}
ul.second {position: absolute; top: 30; left: 50;}

和

<ul class="first">
   <li>one</li>
   <li>two
      <ul class="second">
          <li>a</li>
          <li>b</li>
      </ul>
   </li>
   <li>three</li>
</ul>

你问的是“纯”CSS。纯CSS是为工作使用最好的语义标记,这意味着如果你真的有表格式的数据,这看起来可能比你 应该 使用表格。

您可以使用css标记“list-style-type:none”ie

优力{ 列表样式类型:无; 显示:内联; }

UL Li UL Li 列表样式类型:无; 显示:内联; }

为了进一步了解Zac的答案,您可以在不修改HTML的情况下进行CSS寻址。然后看起来像这样:

<style>
ul li { list-style-type: none; display: inline; float: left; margin: 0 4px;}
ul  {position: absolute; top: 0; left: 0;}
ul li ul li ul{ list-style-type: none; display: inline; float: left;position: absolute; top: 20px; left: 0; margin-top: 30px;}
ul li ul {position: absolute; top: 20; left: 0;}
</style>

<ul>
   <li>one</li>
   <li>two
      <ul>
          <li>a</li>
          <li>b</li>
      </ul>
   </li>
   <li>three</li>
</ul>