android – rem单元在webview中不起作用

2023年10月11日 257次阅读

我使用Phonegap for android创建了一个简单的应用程序,它只是加载我网站的内容.问题是webview无法理解“REM”css单元,即使在同一设备上我在Chrome浏览器中打开网站时它按预期工作.

我正在使用的技术是我设置以字体为单位的根字体大小(例如1px),以及使用rem单位的其他所有内容.看起来在使用webview时,它有一些font-size的最小值,远远大于我的值,它将所有元素大小乘以10-12倍.

有没有办法解决它而不切换到像素而不是rems？

代码示例：

body {
    font-size: 1px;
}
.element {
    width: 15rem;
}

从上面的代码中,元素的宽度应该是15px,如果我在移动浏览器中打开网站,这是正确的,但在webview中它大于150px;

更新：

我几乎可以肯定它在webview中有一个最小的字体大小问题,因为我现在尝试相反,我将根字体大小设置为15px,将.element宽度设置为1rem并且它正确显示所有内容,表示REM单元正在工作如果我将root font-size设置为高于webview中的最小限制.

以下是我的网站在移动Chrome中的外观
[]

这是phonegap应用程序
《android – rem单元在webview中不起作用》

最佳答案 Webview默认增加最小字体大小.这个解决方案对我来说是最好的.现在webview就像大多数其他具有rem单元的浏览器一样. 🙂

https://stackoverflow.com/a/41496408/688352

点赞