CSS blockquote样式中填充的奇怪问题

Question

我使用以下代码在我的网站上设置blockquotes的样式：

blockquote {
border-left: 7px solid #b83131;
background: #ebebeb;
margin: 1.5em 25px;
padding: 1px 10px;
quotes:"\201C""\201D""\2018""\2019";
}

以padding:开头的行控制块引号顶部和底部的填充。出于某种原因，它不能正常工作。它不仅仅是1px填充，而是总是不止于此。无论我设置为填充，它总是至少几个像素高。

例如，如上面代码中所示，使用填充设置，结果如下：

如您所见，顶部和底部的填充超过1px。这是为什么？我希望填充是一个真正的1px，但似乎无论我如何改变代码，它都要么根本没有填充，要么超过1px。

这里有任何帮助吗？

Answer 1

尝试调整blockquote中文本的行高。可能是1px的顶部和底部填充足以使文本下降到下一个完整的行，使其看起来像是填充过的。

Answer 2

如果您查看以下jsfiddle，您会看到只有您发布的代码，才能重现问题。

我自己相信<p>内有blockquote个标记。 只需将其边距设置为0即可将其删除。

p {
   margin: 0;
}

Answer 3

我遇到了类似的问题：我试图最小化块报价上方的空间，所以我设置了

BLOCKQUOTE  {margin-top: 0}

这似乎有时起作用，但并非总是如此。

这是我发现的：当它没有工作时，有一个未公开的段落＆lt; P＆gt;在报价上方某处标记。开头＆lt; BLOCKQUOTE＆gt;标签有效地关闭了该段落，因此不需要的空格即将到来，而不是来自报价的上边距，而是来自其上方段落的下边距。这修好了它：

BLOCKQUOTE  {margin-top: 0}
P   {margin-bottom: 0}

当然，如果您不希望每个段落的底部边距为零，您可以定义一个特殊的类。