1.媒体查询
需求需要同时适配手机端pc端时使用媒体查询 三种不同的尺寸 media（媒介） screen 屏幕 @media screen and(max-width:640px){
手机端 ...} @media screen and(max-width:768){
pad } @media screen and(max-width:1024)
2.缩放
那次面试问到过 有两个像素：物理像素（手机最大的分辨率（手机屏幕尺寸）） 设备独立像素（出厂默认设置的分辨率）
以iphone8为例
最大分辨率可以为750x1334（物理像素）
但是默认分辨率为375X667（设备独立像素） dpr(设备像素比)
之前是使用dpr像素比来进行适配，经过修改使用viewport
将网页缩放为两倍
viewport 手机窗口大小 width=device-width窗口宽度与设备保持一致 让网页缩放1/dpr
使用完meta查询后 让css跟物理像素保持一致（市面上物理像素大小不一 需要进行页面适配 ）
3.rem
使用rem 设置根元素为20px 1rem为20px
html{font-size:20px}
1rem = 20px
借鉴：
amfe-flexible 使用viewport来代替
npm i -S amfe-flexible
