1.mate
<meta name="viewport" content="width=device-width, initial-scale=1">
//width = device-width 这一句的意思是让页面的宽度等于屏幕的宽度。
2.使用 rem
rem 指的是 html 元素的 font-size，html 元素的 font-size 默认是 16px，所以 1 rem = 16px；然后根据 rem 来计算各个元素的宽高，然后配合 media query 就可以实现自适应。
- media query
//有一个需要注意的点是范围大的要放在上面，范围小的放在下面。
@media screen and (max-width: 360px) {
html { font-size: 12px; }
}
参考：css 布局的几种方式
