没有单位的行高的缺点？ [英] Drawbacks to line-height without unit?

问题描述

在没有单位的指定线高度中是否有任何缺点（浏览器/设备不一致...）？

示例：

  body {
 
 line-height：1.5; 
} 
  

解决方案

更好地使用无单位行高 - 请参阅

• http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/


• https://developer.mozilla.org/en/CSS/line-height - 请参阅备注




当然，也有例外。第一个想到的是当你有一个已知 height 的块元素，并且其中一行文本，并且想要垂直居中这行文本 - 我发现最简单的方法是使用 line-height 等于 height 。





---





对于不知道与无单位 line-height 有什么交易的人。]





你有一个 font-size：14px 的元素。它设置在哪里，无论是继承与否，如果你自己设置它或它来自用户代理样式表无关紧要。





现在，如果设置，让我们说 line-height：1.5 ，则会将其转换为 1.5 * 14px = 21px 的像素。所以你计算的 line-height 将会是 21px 。




Are there any drawbacks(browser/device inconsistency...) in specifing line height without unit?

Example:

body {

    line-height: 1.5;
}

解决方案

In most cases, it's actually better to use unitless line-height - see

• http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/
• https://developer.mozilla.org/en/CSS/line-height - see the notes where they show an example

Of course, there are exceptions. The first one that comes to mind is when you have a block element with a known height and with one line of text in it and you want to center that line of text vertically - I find that the easiest way to do that is to use a line-height that's equal to the height of the block element.

---

[Just in case, for anybody who doesn't know what's the deal with unitless line-height.]

Suppose you have an element with font-size: 14px. It doesn't matter where it was set, whether it's inherited or not, if you set it yourself or it came from the user agent stylesheet. The element has font-size: 14px.

Now, if you set, let's say line-height: 1.5 for the same element, this will be translated into pixels as 1.5 * 14px = 21px. So your computed line-height will be 21px.

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