我创建了一个无序列表.我觉得无序列表中的子弹很麻烦,所以我想删除它们.
是否有可能没有子弹的列表?
您可以通过在父元素的CSS上设置list-style-type
to 来删除项目符号none
(通常为a
),例如:
ul {
list-style-type: none;
}
如果您还想删除缩进,您可能还想添加padding: 0
和margin: 0
.
有关列表格式化技术的精彩演练,请参阅列表教程.
如果你正在使用Bootstrap,它有一个"没有样式"的类:
删除列表项上的默认列表样式和左边距(仅限直接子项).
http://twitter.github.io/bootstrap/base-css.html#typography
http://getbootstrap.com/css/#type-lists
你需要使用 list-style: none;
在css,风格,
list-style-type: none;
您必须为
元素添加样式,如下所示:
这将删除子弹.您还可以在样式表中添加CSS,如上例所示.
在css ...
ul { list-style: none; }
对上述内容的细化:如果更长的线条溢出到其他屏幕线,则使更长的线条更具可读性:
ul, li {list-style-type: none;} li {padding-left: 2em; text-indent: -2em;}
使用以下CSS:
ul { list-style-type: none }
本机:
ul { list-style-type: none; }
引导:
注意:如果您使用的是列表组,则不需要列表 - 无样式.
如果您无法使其在该
级别上运行,则可能需要将其置于list-style-type: none;
该级别:
您可以创建一个CSS类来避免这种重复:
编辑:必要时,使用!important
:
我在ul和li上都使用了list-style来删除子弹.我想用自定义角色替换子弹,在这种情况下是"破折号",这会产生很好的效果.所以使用这个标记:
用这个css:
ul.dashed-list { list-style: none outside none; } ul.dashed-list li:before { content: "\2014"; float: left; margin: 0 0 0 -27px; padding: 0; } ul.dashed-list li { list-style-type: none; }
给出一个很好的缩进效果,当文本换行时有效
CSS:
.liststyle { list-style-type: none; }
HTML:
要完全删除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;