移动端布局
媒体查询：@media or and （适配条件）{
css声明}
移动端布局方式：
-方法1：媒体查询+rem单位实现
-优点：简单好理解
-缺点：计算麻烦，有多个设备需要写多个媒体查询
网页中的常用单位：
-px 像素
-em 相对单位
-pt 磅 硬件 打印机
-%
- deg 角度
-rem 相对单位 相对根元素html font-size 进行计算
常见的设计图 dpr
-640px 的设计图 dpr为2
-750px 的设计图 dpr 为2
-1080px的设计图 dpr 为3
main区域为flex1 的时候的条件
overflow:auto 解决内容溢出，占据页面全屏问题
第二种移动端布局方式 vw单位（viewport width）
第二种计算方式：
物理像素/dpr/100=》固定的逻辑像素（px=>rem）
-当设计图为640px ,html{font-size:0.3125px;}
--当设计图为750px ,html{font-size:0.2667px;}
