我网站的第一个单词的正文的字体大小比其余的要大得多。出于某种原因，包含文本的容器将第一个单词从顶部截掉。可能是因为第一个单词的行高与文本的其余部分相同，因此容器无法正确计算自己的高度。
Codepen 片段：http ://codepen.io/sardasht/pen/maJup （我已经包含了我的 css 文件的全部内容以便能够正确调试，所以不会在这里嵌入。如果需要，我会愉快地编辑我的帖子以包含它，但它将是大约 300 行文本）
如果我增加第一个单词的 line-height，同一行上的其余文本将获得相同的 line-height，从而从下面的其余文本跳转。如果我在容器元素中添加一个 margin-top，第一个单词就不再被截断，但是文本的底线被截断。
我在所有父元素上也玩了溢出：可见/隐藏，但无济于事。
p元素有line-height: 1.5em，它将设置其中文本行的高度。由于em单位的原因，高度是根据字体大小确定的，并且p是为使用的元素设置的字体大小，因此行高不会因为子元素上设置的较大字体大小而增加。
我会尝试使用未在 px 或 ems 中设置的行高声明。
p, span { line-height:1 }
我也试过
span { line-height:0.8 }
这似乎给出了最少量的顶级“推动”，但我只在 Mac 上的 FF 中查看过它。
我注意到，对于字体，它们的高度和宽度因浏览器而异。这可能会因未给予适当前导、字距调整等的字体而加剧。这可能会导致“奇怪”的换行符，从而导致设置块高度的“问题”——尤其是从 FF 和 Chrome 到 IE . FWIW。
编辑：http: //jsfiddle.net/mvf6j/
将 line-height 设置为 1（子级的）等于父级 line-height 的 100%；因此，在您的示例代码中 1 = 1.5em。在我的小提琴/示例中，1 = 1em（即使孩子是 2em 字体）。是传承。它使孩子相对于父母。如果您想更改父母的大小，请进行猜测。当您为子项设置明确的行高时，所有在调整大小/关系方面的轻松都会消失。