Html 跳过有序列表项编号
我有一个有序的列表,我想跳过特定项目的数字输出 传统输出:Html 跳过有序列表项编号,html,css,list,html-lists,Html,Css,List,Html Lists,我有一个有序的列表,我想跳过特定项目的数字输出 传统输出: 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中可以实现吗?我发现了一个我以前不知道的问题,但似乎对我没有帮助。另一个选择是使用CSS3计数器: 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中可以实现吗?我发现了一个我以前不知道的问题,但似乎对我没有帮助。另一个选择是使用CSS3计数器: HTML
最简单的方法是从要跳过的项目中删除列表标记,并使用设置下一个项目的编号(在HTML5中不会弃用/过时)。例如:
<ol>
<li>List item
<li>List item
<li style="list-style-type: none">List item
<li value=3>List item
<li>List item
</ol>
列表项
列表项
列表项
列表项
列表项
这是我的解决方案(仅使用CSS),它允许您从ol(有序列表)保持li(列表项)的正常使用。这意味着所有的li
项都是一致的,并且没有任何项不代表与其相邻项相同的事物
代码如下:
。条款和条件li{
位置:相对位置;
}
.条款及条件{
列表样式类型:低拉丁语;
}
.条款和条件h2{
位置:绝对位置;
顶部:-2.4em;
左:-1.5em;
}
.条款及条件h3{
位置:绝对位置;
顶部:-2.4em;
左:-1.5em;
}
.条款和条件h2+*,
.条款和条件h3+*{
边缘顶端:4em;
}
跳过有序列表项编号
参与者同意受这些条款和条件的约束
发起人
Lorem ipsum dolor sit amet,奉献精英。真理是真理,它是一种铜制的力量,在自由的大宪章中,它是一张脸,一张脸,一张脸,一张脸!坐吧,尤瑞
Lorem ipsum dolor sit amet,奉献精英。真理是真理,它是一种铜制的力量,在自由的大宪章中,它是一张脸,一张脸,一张脸,一张脸!坐吧,伊尔。
资格
Lorem ipsum dolor sit amet,奉献精英。真理是真理,它是一种铜制的力量,在自由的大宪章中,它是一张脸,一张脸,一张脸,一张脸!坐吧,尤瑞
进入
Lorem ipsum dolor sit amet,奉献精英。真理是真理,它是一种铜制的力量,在自由的大宪章中,它是一张脸,一张脸,一张脸,一张脸!坐吧,尤瑞
Lorem ipsum dolor sit amet,奉献精英。真理是真理,它是一种铜制的力量,在自由的大宪章中,它是一张脸,一张脸,一张脸,一张脸!坐吧,我爱你。我爱你,我爱你,我爱你。真理是真理,它是一种铜制的力量,在自由的大宪章中,它是一张脸,一张脸,一张脸,一张脸!坐吧,尤瑞
Lorem ipsum dolor sit amet,奉献精英。真理是真理,它是一种铜制的力量,在自由的大宪章中,它是一张脸,一张脸,一张脸,一张脸!坐着,iure.
参赛者必须上传以下图像和文本:
Lorem ipsum dolor sit amet,在amet libero magnam Concertetur facere中用铜酸盐制成的“ipsa hic”
阿迪皮斯精英。真正的消费者
在《自由大宪章》中
被指控了,阿迪皮斯·阿利奎姆!坐吧,尤瑞
附加要求
所有参赛作品必须是参赛者本人的图像或具有相关权限
参赛者必须是lorem
优胜者选择
Lorem ipsum dolor sit amet,奉献精英。Suscipit tenetur减去dolores!自然之美、大之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美、动物之美
现在很简单
只需将以下内容添加到类中。跳过。跳过的列表项使用.skip:
ol li.skip {
list-style-type:none;
counter-increment:none;
}
在HTML中,它将是:
<ol>
<li>first list item</li>
<li class="skip">2nd list item</li>
<li>third list item</li>
</ol>
第一个清单项目
第二个列表项
第三个清单项目
导致:
第二个列表项
我尝试过的一件似乎有效的事情就是添加了一个字体大小:0。这可以应用于前面提到的“skip”类
诚然,此解决方案缺少一些HTML纯度,但非常简单。您真的想跳过该项,还是更像是一个子项或其前面的项目的附加行?是的,我只想跳过此项,但保留其余的编号。它用于曲目列表,可以在一个“磁盘”内分成多个部分。曲目编号需要忽略章节标题。实际上,我不能用单独的列表创建单独的分区,因为编号是针对磁盘中的曲目,而不是每个分区。如果不清楚,请告诉我,你需要一把小提琴。是的,我在想这个解决方案可能是所有可能的。很好。谢谢你的演示!这有一个不幸的副作用,即将所有
元素转换为
元素。此外,使用此方法,您需要添加额外的样式,以补偿列表项在某个点上会放置在数字上。非常有趣。这也有很好的浏览器支持。想不出有什么不好的一面。。。一定有吗?!我能看到的唯一缺点是动态生成时的“值”属性。如果所有这些都在CSS(而不是“跳过”类)中处理,那就太好了
ol li.skip {
list-style-type:none;
counter-increment:none;
}
<ol>
<li>first list item</li>
<li class="skip">2nd list item</li>
<li>third list item</li>
</ol>