html – 如何在有序列表的项目之间添加空行？

参见英文答案 > How do I set vertical space between list items?                                    6个
>             Spacing between bullet list rows                                    8个
我目前有以下HTML：

<ol>
    <li>Foo</li>
    <li>Bar</li>
    <li>Baz</li>
</ol>

这产生了通常的结果：

    > Foo
    >酒吧
    >巴兹

我想在每个列表项之间添加一个空行,以便输出如下所示：

    > Foo
    >酒吧
    >巴兹

这可以通过添加两个< br>来完成.每次收盘前的标签< / li>标签.然而,它是丑陋和不优雅的.

有没有更好的方法在HTML或CSS中实现相同的结果？

解决方法

您可以根据自己的喜好增加每个li的边距或填充.例如.

li {
  margin-bottom: 1rem;
}