html5页面rem布局适配方法有哪些

HTML5页面rem布局适配方法是指使用rem作为页面布局单位，在不同分辨率设备下，通过改变rem的大小实现页面自适应布局的方法。目前主要有以下几种方法：

1. 固定根元素字体大小

这种方法是将根元素的字体大小设置为固定值，然后使用rem作为其它元素的长度单位，在不同分辨率下根据根元素的字体大小来保持布局比例。不过这种方法需要手动调整根元素字体大小，并且无法适配更改设备字体大小的情况。

2. 使用js动态计算根元素字体大小

这种方法是使用js在页面加载时动态计算根元素的字体大小，以达到自适应布局的效果。具体实现方式为，根据当前设备的屏幕宽度，计算出根元素的字体大小，并将计算结果设置给根元素的字体大小属性。这种方法需要较复杂的js代码实现，并且需要在页面加载时动态计算，可能会影响页面加载速度。

3. 使用css媒体查询

这种方法是使用css媒体查询来根据设备的屏幕宽度来动态设置根元素的字体大小，以达到自适应布局的目的。具体实现方式为，在css文件中使用@media规则，并在其中设置根元素的字体大小，根据不同的屏幕宽度设置不同的字体大小值。这种方法比较简单，但需要针对不同的屏幕宽度设置不同的媒体查询规则，工作量较大。

4. 使用框架/插件

当前很多前端框架和插件都提供了适配移动端的rem布局方案，如flexible和amfe-flexible等。这些框架和插件通常会自动计算根元素的字体大小，并将计算结果设置成rem的基准值。使用这些框架或插件可以快速实现rem布局适配，但也需要熟悉它们的使用方法并了解其原理。