Css 62.5%为什么开发人员使用它?

时间:2015-03-11 13:53:06

标签: css responsive-design

我知道我们都可能在62.5%之前使用字体大小,我们在旧的IE版本中使用它来对缩放进行正确的缩放。

所以我理解为什么它是这个价值,以及它如何处理“em”。我不明白的是为什么人们仍然使用它?特别是当他们的设计无论如何不尊重用户字体设置时。

当它使用聪明的方式时,我没有任何反对它,就像那些网站的好例子http://www.polarfoundation.org/它完全尊重用户字体设置并调整显示到它,所以这里绝对需要并且一切都很好。

这里与示例http://froont.com/相反,它与用户字体设置无关,因此如果用户在浏览器默认设置中有超大字体,则其设计会变得简单。因此,如果他们无论如何根据“62.5%”的魔术值进行设计,即“10px”并从该点算出所有其他值,为什么不简单地将“10px”代替“62.5”,这样设计就不会破坏,现在所有的浏览器可以毫无问题地处理“px”的缩放。

所以问题是:

我是否缺少一些?
真的有理由仍然使用“62.5%”而不是“10px”吗? 是否有一些好处使用“62.5%”而不是“10px”即使设计被破坏(根据例子)?

因为如上面的例子所示,如果不能正确理解他们为什么会这样做,我会感到愚蠢。

更新1:
它与font-size:62.5% vs. font-size:10px无关。我知道62.5%在许多点上等于10px,并且知道它与不同的IE行为有什么不同。除此之外我很有意思,为什么它在没有必要时使用。

请在评论前阅读问题。
1)它与缩放无关,看第二个例子,它用作10px的魔术点,它特别打破了缩放的所有内容 2)它与黄金法则无关,62.5%用于获得10px的基本字体以便于数学

更新2:

以下是不同默认浏览器字体大小的两个示例的图像。我希望他们能解释更多我的意思。

正常默认字体大小(16px)的好示例: example 1 normal scale

很好的示例大型默认字体大小: example 1 large scale

在这个例子中都很好,他们不使用魔术值但完全尊重默认浏览器字体,所以即使字体发生变化,一切都会好起来。

错误示例正常默认字体大小(16px): example 2 normal scale

错误示例大型默认字体大小: example 2 large scale

这就是一切都出错的地方,因为他们使用“62.5%”来假设它变成“10px”。但是,如果他们只使用它,因为“10px”一切都还不错,为什么他们和其他许多人仍然不假思索地使用“62.5%”呢?

3 个答案:

答案 0 :(得分:4)

答案简短:

在大多数浏览器中,62.5%等于10px,因此可以更轻松地计算REM单位。

答案很长:

10px是一个非常小的字体大小。但是,如果你明智地应用它,它有一些实用性。

考虑以下代码: https://codepen.io/kgcreative/pen/QvEKZg?editors=1100

我正在将我的基本字体重置为62.5% - 这主要用于使用神奇的1rem = 10px公式来计算我的所有REM单位

然后我使用EMs将身体重置回我的默认字体大小(你看到当我声明body {font-size:1.6em}时,比例为62.5%的数字,现在很容易看到它是16 px。< / p>

并且那里的所有单位也都基于ems。

我没有声明html { font-size: 10px;的主要原因是,如果视障用户重置了他们的基本浏览器大小(向上或向下),我想要尊重这一点,所以我希望我的网站的排版能够比例与其默认浏览器设置成比例。

答案 1 :(得分:2)

开发人员使用它来简化设计。默认字体大小为16px,因此它们将正文字体大小设置为62.5%。因此:

Body font-size = (62.5/100)*16 = 10px

现在作为人类,我们发现使用十进制系统非常容易。从10开始,它也很容易理解分数,因此响应式设计变得更容易!

顺便说一句,我建议您在正文中明确使用font-size: 10px;,因为所有浏览器默认字体大小可能不是16px。

希望我能提供帮助:)

答案 2 :(得分:0)

经过几天的挖掘,询问朋友并期待我得到下一个结论:

1)一些开发人员在不知道其工作原理的情况下使用此解决方案 2)他们中的一些人将此作为其他框架的一部分使用,但他们仍然不知道它是如何工作的,也没有看到指南 3)他们中的一些人计划采用灵活的设计,但忘记了这一点并将此事留下来

就这样。