HTML：如何创建一个数字索引[1]-Java 学习之路

可能重复：
数字嵌套 HTML 中的有序列表
 HTML：有序的子列表

我想创建一个数字索引：

1.0

1.1

1.1.1

1.1.2

1.1.3

1.2

2.0

2.1

2.2

做这个的最好方式是什么？ ul，ol？

<ul>
<li><span>1.0</<span>First entry</li>
<li><span>1.1</<span>Second entry</li>
</ul>

3 回答

1

你正在寻找的东西很容易用 css 每 counter-increment。您不需要自己编写数字。

阅读这里

回复于 2024-04-29T12:55:51+08:00

嗨，你可以做到我给你举个例子

****的 CSS

body{
    counter-reset:section;
}
div{
    margin-top:10px;margin-left:10px;
}
.numercal {
    counter-reset:subsection;
    font-weight:bold;
}
.numercal:before{
    counter-increment:section;
    content:"Section " counter(section) ". ";
    font-style:italic;
    color:red;
}
.numercal-no:before{
    counter-increment:subsection;
    content:counter(section) "." counter(subsection) " ";
}

**** HTML

<div>
    <p class="numercal">Demo Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
</div>

<div>
    <p class="numercal">Demo Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
</div>

<div>
    <p class="numercal">Demo Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
    <p class="numercal-no">Sub Text here</p>
</div>

现场演示点击这里 http://jsfiddle.net/rohitazad/Xwm3C/1/

现在更多关于这个去这个网站http://reference.sitepoint.com/css/counter-increment

http://www.w3.org/wiki/CSS/Properties/counter-increment

回复于 2024-04-29T12:55:51+08:00

0

你不需要跨度，除非你明确地想要将它标记为某些东西，造型等等......除非你需要它做与现在不同的事情，否则你所做的接缝很好。如果你只想用 1,2,3 等枚举它，那么你可以使用 ol 而不是 ul。

回复于 2024-04-29T12:55:51+08:00

HTML：如何创建一个数字索引[1]

3 回答

相关问题