Question

好的，首先，是的，我已经阅读了很多文章（Should I use px or rem value units in my CSS?）和论坛。

我知道1px不是物理像素而是CSS像素，而rem基本上与em相同，但它相对于根元素（因此r中的r - root），而不是父元素。 em本身等于文档中设置的大小，由于与像素相比具有可扩展性而无法扩展，因此它很受欢迎。

在我阅读的所有文章中，每个人都喜欢rem，它应该在现代浏览器中用于font-size，但也使用px作为IE8及更低版本的后退。我看到人们使用rem的主要原因是尺寸更好，并且更适合移动友好＆＃34;。现在突然我读到文章说所有现代浏览器都支持viewport，所以scalibilty不再是一个大问题。

然后我阅读以正确地将rem转换为px，反之亦然，我们可以使用html { font-size: 62.5%; }然后将1rem变为10px。

所有这些混乱之后，如果scalibilty没有问题，因为视口和1rem通过html 62.5％转换为10px，加上我将使用像素作为回退，那么为什么首先使用rem而不仅仅是坚持像素？我再也看不到使用rem的任何好处了。

或者我是否遗漏了rem的一些主要优势？

Answer 1

因此，经过所有研究，我得出的结论是rem的唯一优势是，在浏览器设置中使用更大默认字体大小的用户将获得正确缩放的字体大小，虽然px不会扩展。换句话说，对rem使用font-size，会为您的网站添加对Accessibility的支持。

总结一下：

rem是一种向您的网站添加Accessibility支持的方式。
请注意，大多数用户在浏览器和手机中使用缩放而不是字体大小更改，因为缩放更容易访问。
浏览器缩放对em有额外的影响，换句话说，它会同等地缩放rem和px。
自2012年起，桌面和移动设备上的所有主流浏览器均支持rem。
使用px作为IE8及更低版本的后退选项。
虽然未经W3C指定，但桌面设备和移动设备上的所有浏览器都实施了16px的默认font-size（Google自己免费），相当于1 rem / em
要在px和rem之间轻松转换，您可以使用html {font-size: 62.5%;}将10px转换为1rem

用一句话：rem与px font-size一起使用，以支持辅助功能。

html {
    font-size: 62.5%;
}

.your_class {
    font-size: 16px;
    font-size: 1.6rem;
}

Answer 2

如果浏览器的默认font-size保留为默认16px，则62.5％才有效。仅仅因为你作为一个正常身体健全的人（或者至少是一个视力正常的人）拥有font-size的默认设置，你不能认为这对于普通民众来说是正确的。

考虑视力不佳的人。在他们的情况下，他们的字体大小设置为20px，或者对于非常差的视力可能是28px。如果所有内容都保存在px中，那么对于那些有不同需求的人来说，您的显示不会是可变的。内容将溢出其容器，您的网站将看起来破碎。

或者，也许你可以在你工作的地方找到一块垃圾计算机。在我的第一份工作中，我们曾经在工厂车间使用旧的800x600显示器。这些的默认字体大小是10px。网站看起来很糟糕，这是因为每个人都希望网站内容中的内容比实际内容消耗更多的空间。

显而易见的解决方案是使布局响应内容。 font-size是浏览器根据其用户的偏好自行为表提供的少数几个元素之一。由于该用户是您的受众，因此您最好尊重他们的偏好，因为您希望他们继续访问您的网站，而不是在他们这样做时不讨厌使用它。

只是我的2¢（以及，人们推动rem而不是px）的实际原因。

Answer 3

我们应该使用rems或em，因为它们基于字体大小。似乎有些奇怪，但是这样做可以建立更强大的响应式布局，因为只需更改字体大小，我们就会自动更改长度。

由于它取决于字体大小，这给了我们很大的灵活性，这是一种很棒的技术。

为什么使用rem代替px，无论如何它都是一样的？

3 个答案: