Question

我现在正在阅读将<body>上的字体设置为62.5％的优良做法，以便稍后您可以使用像素单位的10分频转换。

但我想知道：为什么不将<body>设为6.25％？假设默认浏览器字体大小为16像素，则可以使用与像素单位相同的em单位尺寸。

E.g。

body {
    font-size: 6.25%; /* 1px */
}

p {
    font-size: 12em; /* 12px */
}

Answer 1

两个问题。

我似乎记得如果你使用像ems这样的相对单位设置你的初始字体大小很小，如果用户调整文本Internet Explorer的大小，字体大小将在设置之间发生很大的变化。

这是一个奇怪的现象，我不确定它是否仍然出现在IE中，也不是因为你担心IE中用户改变字体大小。
每次嵌套元素时，您都可能会谴责自己重新设置字体大小。

An answer I wrote to another question尽力解释这一点，但简而言之，如果您在ems中使用字体大小，最好尽可能少地使用font-size，而不是制作它当你这么做时，font-size会更容易使用。

例如：假设您希望网站上的所有<li>使用12像素的字体大小。
```
li {
    font-size: 12em;/* 12px */
}
```
如果您使用以下HTML：
```
<ul>
    <li>
        <ul>
            <li>
            ...
```
然后你需要这样做：
```
li li {
    font-size: .083em;/* 12px */
}
```
否则内部<li>将是12像素* 12像素= 144像素！

Ems不是像素。 Ems是指最近祖先的字体大小的百分比，而像素是指实际像素。在我看来，试图将ems变成像素比其他选择更令人困惑。您最好将<body>设置为网站上最常用的字体大小，只需在需要时更改，并在基于em的声明后将预期大小（以像素为单位）放在注释中。（这样，如果你出错了就更容易告诉。）

（当然，我们避免使用像素的唯一原因是因为当用户在浏览器中更改字体大小时，IE不会更改以像素为单位的文本大小。如果您不担心这一点，那么只需使用像素。）

Answer 2

简短回答： 不要这样做。使用px设置字体大小。如果您需要更大的字体，请使用更多的px。

答案很长：
设置基本字体背后的想法是明确em和ex的大小。如果您的基本字体大小为10px，则1.0em为10px，1.2em为12px等。这看起来很简单。一旦容器从基础改变字体大小，该想法就会崩溃。如果您的div字体大小设置为20px，那么突然1em的大小是以前的两倍。

情况变得更糟。人们开始建议应该使用62.5%而不是10px （注意16 * 0.625 = 10）。建议这样做是因为指定字体大小的百分比是旧版Internet Explorer问题的解决方法。除非您使用百分比，否则最终用户无法“放大”。

但是，%（作为默认字体应用时）是绝对单位。它可能看起来像一个相对单位，但在这里，它是用户代理的默认字体大小的百分比，字体大小以点为单位指定。这引入了关于用户代理的微妙且不正确的假设，即屏幕分辨率为96dpi。这种假设通常会产生如下文本：

^{_{嘿，看看我，我太小了，无法阅读！}}

总结：
不要使用旧版IE浏览器（4年有足够的时间来保持向后兼容性; IE7本月已有4年了。）

不要对用户代理的分辨率做出假设，也不要将正文字体大小设置为百分比。

如果您需要更精确的排版控制，请使用像Baseline这样的CSS框架。

Answer 3

如果您这样做，则必须确保调整页面上每种字体的大小。如果你遗漏任何东西，默认情况下会很小（1px）。

调整每种字体的大小可能比您想象的更令人生畏，因为当您使用相对字体大小时，您必须非常具体。

在CSS中设置字体大小时，为什么不设置为6.25％以便px和em单位相同？

3 个答案: