开始

自适应方案：

rem

适配思路:选择一个尺寸作为设计和开发基准

原理：根据视窗宽度动态调整根元素 html 的 font-size 的值

vw

适配思路: 选择一个尺寸作为设计和开发基准，定义一套适配规则，自动适配剩余的尺寸

原理：利用 CSS 视窗的特性，总宽度为 100vw，每一份为一个单位 1vw，设置 1rem 单位为 10vw

px + calc + clamp

适配思路：根据 CSS 的新特性：css变量、calc()函数、clamp()、@container函数实现

---

参考文章：

javascript - 移动端法门：自适应方案和高清方案_个人文章 - SegmentFault 思否