Question

我真的google了很多，但我找不到一个明确的答案。我想根据规范

使用rem

rem单位是相对于root-或html -element。

所以我的问题是：

<html>标记的font-size属性是否覆盖浏览器的默认字体大小？基于该假设设置元素rem是否可靠？

e.g。来自中国的一些用户将其浏览器的默认字体大小设置为12px，而来自欧洲的用户通常具有16px。我希望我的设计能够正确扩展。如果<html>标记包含此设置，则使用rem进行可扩展设计相对容易。

Answer 1

这取决于浏览器的默认样式表。您可以查看CSS2.1用户代理样式表默认值here的（非官方）表。

根据上面列出的页面，默认大小如下所示：

<script type="text/javascript">
var i = 0;
function f(){
i = i + 10;
document.getElementById("more").innerHTML= i;
}
</script>

另外值得一看的是default stylesheet for HTML 4。 W3C建议使用这些样式作为默认值。简略摘录：

$ab = "<p id='more'> </p>";
echo $ab;
for($x=0;$x<$ab;$x++) echo $x . "<br>";
echo "<button type='button' onclick='f()'> > </button>";

希望这些信息有用。

Answer 2

我可能没有完全理解你的问题，在这种情况下我道歉无论如何，我希望这会有所帮助。

1rem等于html元素的字体大小。无论您的样式表是否将font-size分配给html。

例如，如果用户的默认字体大小为15px，则说明

的样式表

div {font-size:2rem}

将显示字体大小为30px的所有div。

另一方面，如果你有一个样式表

html {font-size:12px}
div {font-size:2rem}

然后1rem将是12px，所有div将以24px显示，无论用户的默认字体设置如何。

html {font-size:12px;}
div {font-size:2rem;}

This is normal size text
<div>This is a div</div>

因此，如果您希望1rem保持用户的首选大小，但仍希望以您选择的大小显示大部分网站，那么诀窍是不要更改html的字体大小，而只是body。

body {font-size:12px;}
div {font-size:2rem;}

This is normal size text
<div>This is a div</div>

免责声明：如果您确实更改了样式表中的html字体大小，“最小字体大小”的用户设置可能会搞砸。

另请注意，如果您自己的默认字体大小不是12px，则只会看到这两个片段之间的差异！