vw结合rem实现移动端适配

 为了方便rem的计算：

        html设置font-size的值：100px;

        1rem == 100px

    出现问题：100px不会自动适配 

        找到一个能随着视口改变的单位 vw

    下面需要研究的问题： 100px == ? vw  

 

 

 100px == ?vw

    根据设计图先确定适配的核心设备。

    第一种情况：设计图为640px

        设计图640px 考虑dpr 为2

        640px / 2 == 320px 

        视口的宽 320px

        100vw == 320px

        1vw == 3.2px

        ?vw == 100px

        31.25vw == 100px;

    第二种情况：设计图为750px;

        设计图为750px   考虑dpr为2

        750px / 2 == 375px;

        视口的宽 375px;

        100vw == 375px;

        1vw = 3.75px;

        ?vw == 100px;

        26.67vw == 100px;

 

 记住： 

        如果设计图为640px  html的font-size值为31.25vw;

        如果设计图为750px  html的font-size值为26.67vw;