移动端布局解决方案

移动端布局

1. flex布局 rem/百分比
   px:像素 绝对单位 pixel pix(picture) el(element) 图像元素
   百分比：相对单位 相对于父级元素
   rem:相对单位 root（根元素） 相对于根元素字体大小的倍数
   em:相对单位 相对于父元素字体大小的倍数
   vh: view height 视图高
   vw:view width 视图宽

html 字体设置

html{ 

		font-size:calc(100vw/设计图的视口宽度)
}

水平垂直居中的几种解决方案
1.justify-content:center
align-items:center
2 定位 0 margin ：auto
3定位 margin(top/left) 50% 2D 平移自身 -50%