2020-11-11

一个css属性实现页面响应式布局

使用 clamp() CSS函数，可以创建仅具有一个属性的响应式网页。

clamp()的工作原理是“夹紧”或限制一个灵活的值，使其处于最小和最大范围之间。
添加css

clamp(minimum, preferred, maximum);

使用方法如下：

minimum 最小值：例如 16px
flexible 弹性值：例如 5vw
maximum 最大值：例如 34px

事例

img {
  width: clamp(15vw, 100%, 100%);
}

即：clamp（）在移动端可以动态不同分辨率的尺寸