html – 跳过有序列表项目编号

前端之家收集整理的这篇文章主要介绍了html – 跳过有序列表项目编号前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个有序的列表,我想跳过特定项目的数字输出.

传统输出

1. List item
2. List item
3. List item
4. List item
5. List item

所需输出

1. List item
2. List item
   Skipped list item
3. List item
4. List item
5. List item

这可以在CSS中实现吗?我发现一个<ol> “start” attribute,我以前不知道,但似乎不帮助我.

解决方法

另一个选择是使用CSS3计数器: demo

HTML

<ul>
<li>One</li>
<li>Two</li>
<li class="skip">Skip</li>
<li>Three</li>
<li>Four</li>
</ul>​

CSS

ul {
    counter-reset:yourCounter;
}
ul li:not(.skip) {
    counter-increment:yourCounter;
    list-style:none;
}
ul li:not(.skip):before {
    content:counter(yourCounter) ".";
}
ul li.skip:before {
    content:"\a0\a0\a0"; /* some white-space... optional */
}
原文链接:https://www.f2er.com/html/230502.html

猜你在找的HTML相关文章