html - 增加字体大小时间隙较大

Question

每当我增加字体大小时，<p> 之间就会出现很大的差距。元素和下一个元素。谁能告诉我为什么？

.text_box {
  height: 60px;
  width: 252px;
  background-color: grey;
  text-align: center;
  font-size: 55px;
  border-radius: 6px;
}

<p class="text_box"> text </p>
<p> text </p>

Answer 1

这是因为 p 标签默认有 margin: 1em 0; 而 1em 等于元素的字体大小(55px 在你的情况下)。为避免这种情况，请尝试使用一些静态值覆盖边距(例如 10px 0)