gpt4 book ai didi

android - Long h1 增加了移动浏览器中所有静态定位文本的字体大小

转载 作者:太空宇宙 更新时间:2023-11-03 11:14:38 24 4
gpt4 key购买 nike

我发现在 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>

有谁知道为什么会发生这种情况以及如何控制它?

最佳答案

您尝试过使用视口(viewport)元进行试验吗?此元允许移动浏览器根据您的尺寸规范确定某些元素的尺寸。

这是你如何应用它:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

关于android - Long h1 增加了移动浏览器中所有静态定位文本的字体大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18422311/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com