行高度继承 [英] Line-height inheritance

问题描述

我不能改变我的span元素行高，这是在体内定义（我试过使用！重要，以及不同的行高度标记包括字体/行高）。这里是代码：

I can't change my span element line-height, that is defined in body (I've tried using !important, as well as different line-height notation including font/line-height). Here's the code:

body {
    font: 16px/1.5 Arial, Helvetica, sans-serif;
}

.pageBody.oferta > .cnt .columns ul span {
    font-size: 9px;
    line-height: 1;
}

问题显然是我的spans line-height是1.5

The problem is obviously that my spans line-height is 1.5

更多的web开发工具不显示继承从身体覆盖它（它在网络开发工具交叉）。网站上有很多代码，但我不认为它可能会影响线高度（因此粘贴会是很多垃圾邮件）。

More to that web dev tool doesn't show that inheritance from body covers it (it's crossed in web dev tool then). There's lot of code on the site as well, but i don't think that it could affect line-height anyhow (so pasting it would be lot of spam).

编辑：有趣的事情我发现：当我应用行高大于2，它开始应用在跨度。

Interesting thing i have found out: when i apply line-height bigger than 2, it starts to apply on the span.

推荐答案

p>在块容器上而不是 span 上设置 line-height 。对于 span ，或对于未替换的内联元素，内容区域的高度取决于字体和浏览器，通常规定下降器和上升器;请参阅CSS 2.1规范中的 10.6.1内联，未替换的元素。

Set line-height on a block container, not on span. For span, or for non-replaced inline elements in general, the height of the content area depends on the font and on the browser and generally makes provisions for descenders and ascenders; see 10.6.1 Inline, non-replaced elements in the CSS 2.1 spec.

即使对于 div 元素或其他块元素，您可能会阻止将高度调整为9px通过用户设置，例如最小字体大小设置为更大（Firefox上的用户选项;不能被作者覆盖）。

Even for a div element or other block element, your chances of tweaking the height down to 9px might be prevented by user settings, such as minimum font size set to something larger (an user option on Firefox; cannot be overridden by authors).

我不知道你推断行高，但我的Firebug说，对于从您的示例构建的文档，计算的行高度为9px，但在布局窗格中，高度为13px。这是正常的，通过CSS 2.1原则。

I don’t know how you inferred the line height, but my Firebug says, for a document constructed from your example, the computed line height as 9px but, in the Layout pane, the height as 13px. This is normal, by the CSS 2.1 principles.

这篇关于行高度继承的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！