移动适配
vw / vh
vw是相对单位, 相对视口的计算结果
vw：viewport width
1vw = 1/100视口宽度
l vh：viewport height
1vh = 1/100视口高度
vw单位尺寸
- 确定设计稿对应的vw尺寸 （1/100视口宽度）
查看设计稿宽度 → 确定参考设备宽度 (视口宽度) → 确定vw尺寸 （1/100 视口宽度） - vw单位的尺寸 = px单位数值 / ( 1/100 视口宽度 )
vh单位尺寸
- 确定设计稿对应的vh尺寸 （1/100视口高度）
查看设计稿宽度 → 确定参考设备高度 (视口高度) → 确定vh尺寸 （1/100 视口高度） - vh单位的尺寸 = px单位数值 / ( 1/100 视口高度 )
开发中vw和vh不会混用, 如果混用会导致盒子变形
rem 和 vw / vh 的区别
rem在目前市场比较常见:
- 需要不断修改html文字大小
- 需要媒体查询media
- 需要 flexible.js
vw / vh
是将来的趋势, 使用无需各种判断修改
