移动端开发自适应

1、rem与em

• rem转化为像素大小取决于页根元素的字体大小，即 html 元素的字体大小。 根元素字体大小乘以你 rem 值。
• em，像素值将是em值乘以使用em单位的元素的字体大小。！注意不是相对于父元素
  （父元素的字体大小可以影响 em 值，但这种情况的发生，纯粹是因为继承。）

总结：

• rem 单位翻译为像素值是由 html 元素的字体大小决定的。 此字体大小会被浏览器中字体大小的设置影响，除非显式重写一个具体单位。

• em 单位转为像素值，取决于他们使用的字体大小。 此字体大小受从父元素继承过来的字体大小，除非显式重写与一个具体单位。

适用情况：

• rem：布局自适应，高宽
  -em：根据某个元素的字体大小做缩放而不是根元素的字体大小。一般来说，你需要使用 em 单位的唯一原因是缩放没有默认字体大小的元素。（padding、 margin，line-heigh）
  em和rem详解：https://webdesign.tutsplus.com/zh-hans/tutorials/comprehensive-guide-when-to-use-em-vs-rem--cms-23984

移动端自适应设置html的font-size

 window.onload = function() {
        var width = window.screen.availWidth;
        width = width < 750 ? width : 750;
        var html = document.getElementsByTagName('html')[0]
        html.style.fontSize = width / 37.5 + 'px';
        console.log(html);
    }

2、布局时，一般不写高度，让内容撑开
3、布局时图片，一般只设置宽度，高度会等比例自适应。