我已经做了一些计算,并为此解决了定义集合并将它们转换为任何可以帮助此答案的任何人的最佳解决方案。
CSS基地:
html {
font-size: 62.5%; /* 1rem = 10px on default browser settings (16px) */
}
body {
font-size: 16px; /* setting PX unit for browsers that dont support rem below */
font-size: 1.6rem; /* default to be used, browsers that dont support REM will use PX above */
line-height: 1.5;
font-family: sans-serif; /* used current font-family used on live website */
color: #283533;
}
em单位是相对于亲本,这使得配合问题的字体大小。 rem单位相对于根或html元素。这意味着我们可以在html元素上定义单个字体大小,并将所有rem单位定义为该单位的百分比。
我在这种情况下定义了62.5%的基本字体大小,以便以类似于使用px的方式调整rems的大小。
如你会发现我已经在这个示例中定义的两个像素和REM
字体大小:16px的; font-size:1.6rem;
但是为什么?那么这是一个退而求其次的不支持REM但这种方法的任何旧版本浏览器,转换是轻松了许多有,因为我相信你会同意...例如工作:
8像素= 0.8 REM;
10px = 1rem;
14px = 1.4rem;
26px = 2。6rem;
希望这是任何人都希望准确地这样大小的转换工作的好答案