如何将空段落元素设置为字体大小（文本）的最小高度

Question

如何将空段落元素<p>设置为字体大小的高度？

如果段落元素为空，则它没有高度。如何设置最小高度为文字高度（font-size）？

我知道你可以在元素中添加 ，但我只想通过CSS

来设置它

Answer 1

您可以在 pseudo-element 中使用空格。这应该有效：

p::after {
  content: '[=10=]a0 '
}

现场演示：https://jsfiddle.net/o96swntm/

Answer 2

尝试使用

p:empty {
    height: 14px;
}

Answer 3

您可以在 css 变量 min-height 中分配常规 p

:root {
  --p-height: 20px;
}

p {  
  color: white;
  background: green;
  min-height:var(--p-height);
}

<p></p>
<p>lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem </p>

如何将空段落元素设置为字体大小（文本）的最小高度

How to set an empty paragraph element to the minimum height of the font-size (text)

html

css