响应式布局：同一页面在不同的屏幕上有不同的布局，即一套代码自适应不同的屏幕。
为什么 vw + rem 能用于实现响应式布局？
px 绝对长度单位，不同客户端表现都相同，不具有响应式。
em 相对长度单位，相对于父元素的 font-size 值，不同元素的父元素的尺寸各不相同，没有统一标准。
rem 相对长度单位，相对于根元素的 font-size 值，页面中的根元素只有一个（即 html 标签），标准统一，可用于响应式布局。
vw 相对长度单位，表示视口宽度的百分比，例如，1vw 等于视口宽度的 1%。这种单位在制作响应式布局时非常有用，因为它可以随着视口宽度的变化而自动调整。使用 vw 可以实现元素的宽度随着视口宽度的变化而变化，从而实现响应式布局。
推荐方案
PC：根元素使用vw，子元素使用rem；
Mobile：根元素使用px，子元素也使用px；
CSS
html {font-size:1vw;}
.element {font-size:1rem;}