移动端rem计算根节点字体大小导致CSS变形如何解决？

避免移动端根节点字体大小计算引起的css变形

在使用rem计算根节点字体的大小时，移动端项目在页面首次加载时可能会出现CSS变形的问题。这是由于在根节点字体大小赋值后，页面内容需要重绘。下面介绍解决方法：

解决方案：

将计算根节点字体大小的代码放在页面的最前面，具体来说，放在

标签内。

原理：

此举确保了在页面任何内容显示之前，根节点字体大小就已经赋值。这样，页面加载时就无需重绘内容，避免了CSS变形。

示例：

如果你熟悉flexible.js，可以使用其中的方法：

1. 在页面中内联flexible.js代码。
2. 将flexible.js放在所有其他资源加载之前。

参考：

• [amfe/lib-flexible at master](https://github.com/amfe/lib-flexible/blob/master/README.md)

以上就是移动端rem计算根节点字体大小导致CSS变形如何解决？的详细内容，更多请关注其它相关文章！