CSS 計數器可以建立帶有小數點的編號清單嗎？

建立帶有小數點的編號列表

CSS可以用來產生帶有小數點的編號列表，例如1.1、1.2和1.3 ，而不僅僅是1、2 和3？應用 list-style-type:decimal 只會產生後一個序列。

解決方案：利用計數器

為了達到所需的結果，可以使用計數器：

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

此CSS 樣式表為每個嵌套列表項分配一個帶有小數點的數字。例如，「1」、「1.1」、「1.1.1」等。

範例：

<ol>
  <li>li element
    <ol>
      <li>sub li element</li>
      <li>sub li element</li>
      <li>sub li element</li>
    </ol>
  </li>
  <li>li element</li>
  <li>li element
    <ol>
      <li>sub li element</li>
      <li>sub li element</li>
      <li>sub li element</li>
    </ol>
  </li>
</ol>

以上是CSS 計數器可以建立帶有小數點的編號清單嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！