如何使用 CSS 增加 blockquotes 不同部分之间的间距？

Question

我有一堆嵌套的引号要显示，但我发现（见下面的示例）引号之间的间距太小了。我该如何增加它？

HTML:

<blockquote>stuff
  <blockquote>neato</blockquote>
</blockquote>

CSS:

blockquote {
    border-left: 1.5px solid #ccc;
    color: #888;
    margin: 0 0 10px 0;
    padding: 0 0 0 12px;
}

这是一个互动示例：http://codepen.io/anon/pen/bNKZVo?editors=110

在那个例子中，我发现 "neat" 下的间距和下一个引号太紧了，我想要更多的空间。我尝试了 line-height，但是当它们之间的间距最终变得更好时，（大约 50 行高）它使第二个引号的高度变得荒谬。

Answer 1

如果你想在嵌套的 bloquote 中添加 margin top，那么在 CSS 中你可以将其表示为：

blockquote blockquote {margin-top:10px}

这样在顶层 bloquote 上没有边距，但所有嵌套的都得到它。

Answer 2

新的 CSS 区块怎么样：

blockquote > blockquote {
    margin-top: 20px;
}

这只会影响嵌套引号，不会影响顶级引号。