苹果手机的尺寸:5s及以下都是320px 6是375px宽度 6plus是414px宽度
常用的安卓尺寸:320、360、480、540、640、720...
在真实项目中，设计师给我们的设计稿一般都是:640*960 / 640*1136 / 750*1334
响应式布局的解决方案:
1）、流式布局法
容器或者盒子的宽度一般都不写固定的值，而是使用百分比（相对于视口区域的百分比）
其余的样式:字体、高度、margin、padding等等都按照设计稿上标注尺寸的一半来设置
对于有些屏幕尺寸下，我们设置的固定值看起来不是特别的好看的话，使用@media进行微调整
特殊情况:设计师的设计稿是640px,我们的素材图也是640px的，这样的话在iphone6/iphone6 plus展示的时候，图片不够大、对于这种情况我们需要单独的找设计师要一张更大的图。
@media all and (-webkit-min-device-pixel-radio:2) and (min-321px){}
@media all and (min-641px){}
2）、REM响应式布局
我们做的H5页面只是在移动端访问(REM不兼容低版本的浏览器)
REM:当前页面中元素的REM单位的样式值都是针对于HTML元素的fontSize的值进行动态计算的
第一步:从UI设计师拿到设计稿(PSD格式的设计稿) 640*1136
第二步:在样式中给HTML设计一个fontSize的值，我们一般都设置一个方便后面计算的值，例如:10px、100px...这里我们之所以用100px,主要是浏览器最小的字体大小都是12px，用10px比例计算的结果和真是UI设计稿会存在一点点的偏差
html{
font-size:100px;/*1REM = 100px*/
}
第三步:写页面，写样式
完全按照设计稿的尺寸来写样式，此时不用管任何的事情，设计稿给你的宽度、高度、字体大小、margin、padding的值是多少，我们就写多少
但是我们在写样式值的时候，需要把得到的像素值除以100，计算出对应的REM的值，我们设定的也都是REM的值（值得注意的是:真实项目中外层盒子的宽度我们一般还是不写固定值，我们沿用流式布局法的思想，我们用百分比的方式布局）
第四步:根据当前屏幕的宽度和设计稿的宽度来计算我们HTML的fontSize的值(当前屏幕的宽度/设计稿的宽度*fontSize)
设计稿:640 600*300 font-size=100
手机:320 300*150 font-size=50
当页面的宽度大于设计稿的宽度的时候，可以通过判断clientWidth 然后不再修改fontSize的值，页面大小不在改变
有时候也会检测浏览器和项目，当两个都是pc端的或者移动端的，来跳转到相对应的项目。window.location.href = xxx