【CSS】min 和 max 函数（设置最大最小值）

文章目录

• min() 函数：允许你从逗号分隔符表达式中选择一个最小值作为 CSS 的属性值

width: min(1vw, 4em, 80px);

• max() 函数：让你可以从一个逗号分隔的表达式列表中选择最大（正方向）的值作为属性的值

width: max(10vw, 4em, 80px);

• 注意事项：

1. max或min允许将max()和其他min()函数嵌套为表达式值。这些表达式是完整的数学表达式，因此可以直接使用加、减、乘、除运算，而无需使用calc()函数本身。
2. 使用标准的运算符优先规则，表达式可以是加(+)、减(-)、乘(*)和除(/)运算符的组合值。
3. 请确保+和-操作数两边各加一个空格。表达式中的操作数可以是任意的<语法的价值。
4. 你可以在表达式中为每个值使用不同的单位。还可以在需要时使用括号来确定计算顺序。
5. 你经常需要合并min()和max()的值，或者在clamp()或calc()函数中使用min()。

small {
  font-size: max(min(0.5vw, 0.5em), 1rem);
}