3

可能重复:
在 HTML 中编号嵌套的有序列表

道歉,因为我有点 CSS 菜鸟。

我有一份条款和条件清单。

每个部分的编号如下:

1.0 This Website
1.1 This website...
1.2 etc etc

2.0 ...
2.1 ...
2.2 ...

我知道我可以使用有序列表,但据我了解,“开始”属性已贬值。

我有什么选择?

4

3 回答 3

2

从Mozilla窃取- 使用 CSS 计数器

JSFiddle

HTML:

<ol class="level0">
  <li>This Website
    <ol>
      <li>This website</li>
      <li>etc etc</li>
    </ol>
  </li>
  <li>...
    <ol>
      <li>...</li>
      <li>...</li>
    </ol>
  </li>
</ol>

CSS:

ol {
  counter-reset: section;
  list-style-type: none;
}

ol.level0 > li:before {
  counter-increment: section;
  content: counters(section, ".") ".0 ";
}

li:before {
  counter-increment: section;
  content: counters(section, ".") " ";
}
于 2013-01-17T11:20:38.303 回答
1

您还可以使用list-style-type css 属性。

ol { list-style-type: decimal; }
于 2013-01-17T10:35:22.723 回答
1

您可以为此使用反增量。像这样写: HTML

<ol>
  <li>item 1
    <ol>
      <li>sub item 1</li>
      <li>Sub item 2</li>
   </ol>
  </li>
  <li>item 2
    <ol>
      <li>sub item 1</li>
      <li>Sub item 2</li>
   </ol>
  </li>
</ol>

CSS

ol {
  counter-reset: section;
  list-style-type: none;
}     
ol li { counter-increment: section; }

ol li:before  { content: counters(section, ".") ". "; }

检查这个http://jsfiddle.net/xC8ne/10/

检查此以获取更多HTML 中的 Number 嵌套有序列表

于 2013-01-17T11:21:10.620 回答