我发现在Chrome和Firefox移动浏览器中，一定长度的h1会增加页面上所有静态位置的文本的字体大小，而不是绝对位置的文本。触发问题所需的h1长度似乎取决于浏览器和（可能）设备。
例如，在使用Chrome或Firefox的Nexus 4上，以下代码中的h1文本和静态放置的div文本呈现太大，而绝对放置的div文本以正常大小呈现。从h1标签中删除2个字符的文本会导致所有文本在Chrome中以正常大小显示。删除另外2个字符会使所有文本在Firefox中以正常大小显示。
<html>
<body style="margin: 0;">
<h1 style="font-size: 1em;">h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1 h1</h1>
<div style="font-size: 1em;">div</div>
<div style="position: absolute; font-size: 1em;">absolute</div>
</body>
</html>
有谁知道为什么会这样以及如何控制它？
您是否尝试过使用视口元进行实验？此元允许移动浏览器根据您的尺寸规格确定某些元素的尺寸。
这是您应用它的方法：
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
| 归档时间： |
|
| 查看次数： |
1295 次 |
| 最近记录： |