以 px 和 rem 为单位的字体大小：为什么将两者都添加到同一个元素中？答案

【问题标题】：Font-size in px and in rem: Why add both to the same element?以 px 和 rem 为单位的字体大小：为什么将两者都添加到同一个元素中？
【发布时间】：2016-04-09 06:01:25
【问题描述】：

body,
button,
input,
select,
textarea {
  color: #404040;
  font-family: sans-serif;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5; }

这是什么意思，它是如何工作的？

【问题讨论】：

对于不支持 REM 的浏览器？

标签： css font-size

【解决方案1】：

px 这是不支持rem 单元的浏览器的后备方案（IE8 就是一个显着的例子）。

查看rem Can I Use... feature 以获得浏览器支持。

任何不支持rem 单位的浏览器将改为依赖px 单位，从而防止浏览器将字体大小默认为任意大小。

【讨论】：

【解决方案2】：

font-sizein 像素将是 rem 在浏览器不支持时的回退。

在这种情况下将是 IE8 或 IE9/10，如果使用 font 速记属性

【讨论】：

【解决方案3】：

正如其他人所说，这是一个后备。

同样重要的是要注意顺序很重要，如果两个声明颠倒了，那将毫无用处。

css 声明将字体大小设置为 16px，然后尝试用 1 rem 覆盖它。如果浏览器不支持 rem，则不会发生覆盖。

【讨论】：

【解决方案4】：

当其中一个单元不起作用时，它将使用默认的那个...但是如果您按照您在代码中编写的方式编写并且两者都被允许，它将根据以下规则选择最新的一个CSS 中的特异性。

【讨论】：