jQuery/CSS:quot；正常值“===？”？二甲苯

我正在调用

$（“#foobar”）.css（“行高”）

并返回“正常”。如何将其转换为像素量？“正常”是在CSS规范中定义的还是特定于浏览器的？

正常实际上被称为

normal

，因为浏览器存在很大的不一致性

声明线条高度：不仅正常 不同的浏览器不同，我 其实已经预料到了，量化 这些差异是全部 但它们也不同于一种字体 面对另一个，也可以有所不同 在给定的面内

---

normal

是

行高的有效设置，因此对于返回该设置的浏览器来说，没有真正的解决方法

或者，您可以使用
.css（'height'）
，因为它只计算元素的内部部分，而不计算填充/边框/边距。如果你有一个多行的元素，或者一个不仅仅包含文本的元素，这需要一点创造力


编辑：解决方案的一个例子是


在元素中，您只需使用#def的
.height（）
，即可找到行高，因为它始终只有一行，因此父元素的行高


Windows XP中的Chrome浏览器就是一个例子，它在JSFIDLE中返回
normal
，除非另有明确规定。Firefox返回像素计数<代码>正常

是根据w3规范的初始值。

根据，似乎大多数最近的浏览器对

行高使用相同的值：normal

：1.14，id用1.14系数测试

字体大小

属性

使用多种浏览器（在Windows XP上）进行了尝试：

• 铬21.0.1180.75
• 火狐14.0.1
• Safari 5.1.7
• 歌剧11.64
• IE 7
• IE 8

编辑

我错了，

行高

取决于

字体系列

，

字体大小

，您的浏览器，可能是您的操作系统

---

更多阅读。

精确计算像素的正常线高度很困难。不过，根据数据，它大约是1.2米

如果您：

body{
  font-size: 16px;
}

因此，您的网站的正常字体大小为16px，那么正常的行高大约为

24px

。这意味着您可以计算正常字体大小像素值乘以

1.5

，即

16px*1.5==24px

---

注意：我没有乘以1.2，因为px值和em值之间存在差异。

但是这是很久以前写的，但帮助我在任务中编写了临时解决方案。我正在复制这段代码，其他人可能无法使用它

$('#lineHeightInc')
.click(function() {
    var box = GetSelectedBox();
    var ct = box.data('LineHeight');
    if (isNaN(ct))
        ct = 0;
    ct++;
    box.css('line-height', (parseFloat(box.css('font-size')) * 1.61 + ct) + 'px');
    box.data('LineHeight', ct);
});

$('#lineHeightDic')
.click(function () {
    var box = GetSelectedBox();
    var ct = box.data('LineHeight');
    if (isNaN(ct))
        ct = 0;
    ct--;
    box.css('line-height', (parseFloat(box.css('font-size')) * 1.61 + ct) + 'px');
    box.data('LineHeight', ct);
});

---

您使用的是哪种浏览器/平台？现场演示可能也有帮助（而且都很好）。Firefox 3.6.8和Chrome 6.0.472.51测试版（在Ubuntu 10.04上）都返回像素值，正如预期的那样。在SO

$（'div.container'）.css（'line-height'）返回11.2px（FF）。Windows XP上的Chrome返回
正常
我认为值得提供一个链接，返回Eric Meyer的站点，以获取您的报价来源，阅读一篇引人入胜的文章：-1因为这还不足以回答问题。很好的信息，但应该是一个注释。@MartinJespersen我不打算删除答案，因为即使现在读了，我仍然认为我的答案正确，因为
normal
是特定于浏览器的，因此跨浏览器不一致，不应转换为像素。也就是说，我非常感谢您花时间提供有关否决票的反馈，谢谢！：）那么这是否意味着“线高：1.14em”是等效但明确的陈述呢？我假设它，但它不是真的<代码>行高

取决于

字体系列

，

字体大小

，您的浏览器，可能是您的操作系统。。。您会发现一些关于Still Zeplin的阅读，Zeplin认为这对开发人员来说是一个有用的价值：显然，您提供的解决方案似乎是最好的选择。谢谢。一个小提示：控制浏览器的初始值，不要使用普通的。许多人还记得旧的

font-size:101%hack

和许多其他东西，从2018年起，一种方法是重置html，并在任何其他元素（如

html{lineheight:1.15；font-size:10px；}

和

body{lineheight:1.3125；font-size:1.6rem；}）上想要“正常”时使用
rem
单位值

=一致的

16px字体大小

和

21px行高

。然后使用

行高：2.1rem将元素规格化。（只需将XX px设为10即可获得rem:1.2rem=12px，2.0rem=20px）。