如何设置列表项之间的垂直间隔？

<ul>显然，在一个元素内，行之间的垂直间距可以使用line-height属性设置格式。

我的问题是，在一个<ul>元素内，如何设置列表项之间的垂直间距？

您可以使用保证金。参见示例：

http://jsfiddle.net/LthgY/

li{
  margin: 10px 0;
}

的HTML

<ul>
   <li>A</li>
   <li>B</li>
   <li>C</li>
   <li>D</li>
   <li>E</li>
</ul>

的CSS

li:not(:last-child) {
    margin-bottom: 5px;
}

编辑：如果您对最后一个li元素不使用特殊情况，则您的列表之后将具有较小的间距，您可以在此处查看：http : //jsfiddle.net/wQYw7/

现在将其与我的解决方案进行比较：http : //jsfiddle.net/wQYw7/1/

当然，这在旧版浏览器中不起作用，但是您可以轻松地使用js扩展名，这将在旧版浏览器中启用。

我倾向于具有IE8支持的优点。

li{
    margin-top: 10px;
    border:1px solid grey;
}

li:first-child {
    margin-top:0;
}

JSFiddle

margin在li标签中添加一个。这将在li和之间创建空格，您可以line-height用来设置li标签内文本的间距。

很多时候，在生成HTML电子邮件爆炸时，您不能使用样式表或样式/ style块。所有CSS都需要内联。如果要调整项目符号之间的间距，请使用li style =“ margin-bottom：8px;”。在每个项目符号中。根据您的喜好自定义像素值。

要应用于整个列表，请使用

ul.space_list li { margin-bottom: 1em; }

然后，在html中：

<ul class=space_list>
<li>A</li>
<li>B</li>
</ul>

使用伪类为每个列表设置padding-bottom是一种可行的方法。也可以使用线高。请记住，字体属性（如字体系列，字体粗细等）对于高度不均匀起着重要作用。

<br>在<li></li>我尝试过的所有Web浏览器中，行条目之间的似乎都很好地工作，但是它未能通过在线W3C CSS3检查器。它给了我精确的行距。就我而言，由于它无疑是有效的，因此无论W3C怎么说，我一直坚持使用它，直到有人提出了一个好的法律替代方案为止。