css - 如何在 和

Question

我有一些正文大致是这样的:

<p>Article nor prepare chicken you him now. Shy merits say advice ten before lovers innate add.</p>
<h2>Do commanded an shameless we disposing do</h2>
<p>Do commanded an shameless we disposing do. Indulgence ten remarkably nor are impression out. Power is lived means oh every in we quiet.</p>
<h2>Alteration unaffected impossible ye</h2>
<p>For saw half than cold. Pretty merits waited six talked pulled you. </p>

我想在 h2 和 p 元素之间留一些适当的间距，以便读者知道他们正在阅读文档的新部分。 p 的大小为 160% (16px)，h2 的大小约为 220% (22px)。

它们之间的理想距离约为 15px。但这是一个固定值，所以我这样做了:

p + h2 {margin-top: 1em} /* instead of margin-top:15px */

它看起来不错，但我不确定它是否符合文本布局规则。由于 h2 标签的大小，现在 margin-top 值等于 22px。

我做得对吗，或者有正确的方法吗？我担心的是，如果 h2 字体大小增加但 p 元素没有增加，那么它们之间的边距会很大并且看起来很愚蠢。

Answer 1

听起来好像您只需要给您的元素一些填充，如果您希望它特定于某些元素，则使用类。

这是一些 JS fiddle ，其中包含分配给 P 元素的类

<p class="textspan">Article nor prepare chicken you him now. Shy merits say advice ten before lovers innate add.</p>

.textspan{
padding-bottom: 100px;
}

https://jsfiddle.net/vhbsdbjp/