带有数字而不是子弹点的无序列表

时间:2015-06-15 12:51:06

标签: html css css-counter

我有一个条款和条件文件,我需要在网站上。然而,有很多条款和要点,如2,2.1,2.1.1等。

我以为我可以做一个无序列表并使用css来摆脱子弹点。我意识到这看起来有点啰嗦,但我不是HTML专家,我也不确定如何去做。

4 个答案:

答案 0 :(得分:3)

尝试使用counters



ol {
  counter-reset: item;
}
li {
  display: block;
}
li:before {
  content: counters(item, ".")". ";
  counter-increment: item;
}

<ol>
  <li>test</li>
  <li>test</li>
  <ol>
    <li>testing</li>
    <li>testing</li>
  </ol>
</ol>
&#13;
&#13;
&#13;

这将产生:

  
      
  1. 测试
  2.   
  3. 测试

         

    2.1。测试

         

    2.2。测试

  4.   

在此处阅读更多内容:https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Counters

答案 1 :(得分:1)

您可以使用ol

像这样:

<ol>
  <li>Hello 
   <ol>
    <li>Hello 1</li>
    <li>Hello 2</li>
    <li>Hello 3</li>
   </ol>
  </li>
  <li>hi</li>
  <li>hey</li>
</ol> 

输出:

enter image description here

希望有所帮助:)

答案 2 :(得分:0)

你尝试过有序清单吗?

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

http://www.w3schools.com/tags/tag_ol.asp

答案 3 :(得分:0)

您可以使用CSS更改/删除项目符号,但如果您想使用数字,则必须使用有序列表。

要删除项目符号,只需在CSS中使用以下行:

list-style-type:none