rem布局：现在移动端最流行的方式；
em：是相当于父级元素或者自身的 font-size 值，如果自身有 font-size 优先走自身；
rem：是一个像素单位（root（根 --> html）em）；是相对于页面 HTML 的 font-size
1rem = HTML 的 fontsize；
px：像素
为什么要适配？
因为每款手机的屏幕尺寸不一样，同一个应用在不同的手机上面显示是不一样的，我们前端要做到所有的手机都兼容。
兼容布局的发展过程：
media --> 百分比 --> table --> rem
视口：
布局视口 --> 视觉视口 --> 理想视口；