响应式开发
利用一套代码实现页面的布局和排版以适配不同分辨率的设备。
1. 添加 viewport meta标签
2. Media Queries
几个参数：
| 参数名称 | 描述 |
|---|---|
| min-width | -- |
| max-width | -- |
| min-height | -- |
| max-height | -- |
| orientation=portrait | 当视窗高度大于或等于宽度 |
| orientation=landspace | 当视图宽度大于高度 |
样式断点：
- mobile 移动断点 视窗宽 <= 768px
- tablet 平板断点 视窗宽 >= 769px
- desktop 桌面端 视窗宽 >= 1024px
- tablet 平板断点 视窗宽 >= 769px
- widescreen 宽屏电脑 视窗宽 >= 1216px
- fullhd 高清宽屏 视窗宽 >= 1408px
3. 使用viewport单位及rem
仅使用vw作css长度单位
vw搭配rem 寻找最优解