我创建了一个无序列表。我觉得无序列表中的项目符号很烦人,所以我想删除它们。
有可能有一个没有项目符号的列表吗?
我创建了一个无序列表。我觉得无序列表中的项目符号很烦人,所以我想删除它们。
有可能有一个没有项目符号的列表吗?
当前回答
要完全删除ul默认样式:
list-style-type: none;
margin: 0;
margin-block-start: 0;
margin-block-end: 0;
margin-inline-start: 0;
margin-inline-end: 0;
padding-inline-start: 0;
其他回答
如果您无法使其在<ul>级别工作,则可能需要将列表样式类型:none;在<li>级别:
<ul>
<li style="list-style-type: none;">Item 1</li>
<li style="list-style-type: none;">Item 2</li>
</ul>
您可以创建一个CSS类来避免这种重复:
<style>
ul.no-bullets li
{
list-style-type: none;
}
</style>
<ul class="no-bullets">
<li>Item 1</li>
<li>Item 2</li>
</ul>
必要时,使用!重要:
<style>
ul.no-bullets li
{
list-style-type: none !important;
}
</style>
可以使用::marker伪元素隐藏它们。
透明::标记
ul li::marker {
color: transparent;
}
ul li::标记{颜色:透明;}上一页{填充内联开始:10px;/*只需重置浏览器初始填充*/}<ul><li>子弹很烦人</li><li>我想删除它们</li><li>嘿!::救援标志</li></ul>
::标记空内容
ul li::marker {
content: "";
}
ul li::标记{内容:“”;}<ul><li>子弹很烦人</li><li>我想删除它们</li><li>嘿!::救援标志</li></ul>
当您需要从特定列表项中删除项目符号时,效果更好。
ul li:nth-child(n)::marker { /* Replace n with the list item's position*/
content: "";
}
ul li:not(:第n个孩子(2))::标记{内容:“”;}<ul><li>子弹很烦人</li><li>但我可以使用::标记</li><li>但不会再这样了</li></ul>
如果您想在不使用CSS的情况下保持简单,我只需要;在我的代码行中。即<table></table>。
是的,它会留下一些空间,但这不是坏事。
要完全删除ul默认样式:
list-style-type: none;
margin: 0;
margin-block-start: 0;
margin-block-end: 0;
margin-inline-start: 0;
margin-inline-end: 0;
padding-inline-start: 0;
在BOOTSTRAP中,可以通过在li标记的父类上设置列表未设置样式的类来删除项目符号。
<ul className="list-unstyled">
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>