Html 删除段落的顶部和底部填充？

我想删除段落文本的顶部和底部填充，而不更改文本的行高。请看下面的图片，我希望顶部和底部边框与文本之间没有任何填充。 段落高度不是固定的

HTML:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>

p{
    width: 200px;
    line-height: 2.2;
    border: 1px solid red;   
}

演示：

---

您可以用div包装，然后给它一个负边距演示

如果不解决

行高

属性（毕竟是

行高

造成了空间），就无法实现这一点；但是，您可以只针对

：：第一行

伪元素的

行高度

：

p{
    width: 200px;
    line-height: 2.2;
    border: 1px solid red;
    padding: 0;
}

p::first-line {
    line-height: 1em;
}

不幸的是，没有

：：最后一行

伪选择器，因此只能针对第一行

参考资料：

---

该空格是

行高的直接结果，顺便说一句，
边距
空格会出现在
边框的外面
，边距里面出现的是
填充
。你的jsfiddle中没有
。对不起，我更新了链接。你能证明这一点吗？因为就我所知（）它不是。顺便说一句，他的
ul
已经指定了继承的
padding:0
（无可否认，他的小提琴中也没有
p
）。他没有任何padding，这无助于解决问题。不仅如此，你还有两行代码来做同样的事情？坏代码！下次尝试
padding:0
，我在本页上回答了您的问题。小提琴是一个不同的问题，不包含或填充物。你的小提琴是由线条高度决定的。这正是行高的含义，它是一种手动设置文本行高度的方法，用于包装文本等。实际可见大小由字体大小决定，在较小程度上由字体系列决定。普通文本/字体的平均行高约为1.2米。任何大于此值的内容都会导致出现可见的字母框，这正是您所描述的。修复确切示例的唯一方法是引入更多标记来确定行号，以便您可以对第一行/最后一行进行不同的样式设置。Vector，很抱歉，我发布了错误的URL，但不管是还是
，这都无关紧要，问题是关于删除顶部和底部的空间。另一个警告是：：first-line不适用于IE8或之前的任何东西。MDN不同意quirksmode。谢谢大卫的回答。有没有可能通过添加额外的标记来实现这一点？@j08691:真有趣！这是我第一次意识到PPK/Quirksmode在兼容性方面是错误的（不幸的是，如果它是错误的，我没有任何IE可以测试）。@user966582:是的，但可靠吗？我认为，您需要JavaScript来确定哪一行中有哪些文本（除非您特别将每一行文本包装到
span
或
div
元素中，并使用
display:block
或其他什么？）。
p{
    width: 200px;
    line-height: 2.2;
    border: 1px solid red;
    padding: 0;
}

p::first-line {
    line-height: 1em;
}