使用list-style-type删除<ul>中的水平间距:无
使用list-style-type删除<ul>中的水平间距:无
提问于 2013-02-28 11:15:45
在http://www.w3schools.com/cssref/playit.asp?filename=playcss_ol_list-style-type&preval=none上，为不同的list-style-type值提供了一个很好的概述。
但是，对于值none，它仍然为空列表符号保留了一些水平空间。有没有一种方法可以删除这个水平间距，这样文本实际上就像没有列表一样向左移动？我想在列表项上使用text-align:center，这种水平间距使它们不能真正居中。我需要使用<ul>，因为内容管理系统以这种方式引入了它。
基本上，在默认情况下，list-style-type:none对项目符号执行visibility:hidden，而我希望在项目符号上实现display:none。这样做的正确方式是什么？
回答 4
Stack Overflow用户
回答已采纳
发布于 2013-02-28 11:17:51
这是浏览器的默认样式添加的空间，只需使用CSS重置来重置所有浏览器的默认样式。大多数块元素都有一些默认的边距/填充。即使是<body>元素在默认情况下也有8px的边距。
这是Eric Meyer重置的链接：http://meyerweb.com/eric/tools/css/reset/
为了自己看看，请添加：
ol {
margin: 0;
padding: 0;
}
/* This would be declared in the above reset */Stack Overflow用户
发布于 2013-02-28 11:38:19
在开始使用CSS之前，请确保添加浏览器重置样式。
您必须添加以下内容：
ol, li {
margin: 0px;
padding: 0px;
}关于这个问题。
Stack Overflow用户
发布于 2018-12-14 19:05:02
最近我发现了一个更好的方法，就是将<ul>设置为display: contents;。因此，css应该看起来像这样：
ul {
list-style-type: none;
display: contents;
}
ul > li {
padding: 0;
margin: 0;
text-align: center;
}这应该能起到作用。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15126789
复制相关文章
相似问题
腾讯云开发者
