前端适配方案
一.主流适配方案
目前业内比较常见的适配方案。
1.JS根据屏幕动态计算，根据比例划算，当前屏幕下应有的字体大小。
2.媒体查询，使用媒体查询，设置不同尺寸下的px/rem/vw,vh大小
3.flex布局，CSS3中提出的新布局方案，常用在移动端。
使用rem做为移动端尺寸，完全替代px。
flexible方案：
移动端使用iphone6做为设计稿标准。
1rem=75px，通过不同的机型换算rem。
vw+vh+rem+css媒体查询组合方案：实现效果
用法：
1.元素大小单位使用rem。
2.根据设计稿的屏幕宽度设置全局html的fontSize大小，单位用VW。
例如：
width=1200px时的浏览器，html的font-size:1vw=12px
width=1800px时的浏览器，html的font-size：1vw=18px
例如：
375px（iphone6）,p：fonts-size：1rem = 12px
400，p：font-size：1rem=12.8
为什么不使用px？
px是一个定死的值，完全无法自适应，但是，rem是可以自适应的，他是一个相对值。
二.VW的定义
vw：网页视口宽度的1%
这就说明，vw本身自带自适应的属性，所以，如果设置了字体为vw属性，会根据屏幕的逻辑像素值大小改变而改变，不同的机型做不同的适配。据说VW的兼容性差一些。
三.媒体查询
虽然以上的方法可以解决大部分的适配问题。我们看到设计稿>1200px的情况，谷歌浏览器有最小的一个字体标准（12px），要通过媒体查询空值他的上下限。
