不错的视频 来自 Kevin Powell。以下是一些笔记、想法以及我在观看过程中学到的一些东西。刚推出时，我主要痴迷于font-size的使用，但它们只是函数，因此可以在任何使用数字的地方使用，例如 长度。
有时非常基本的使用允许更简洁的代码，但实现它的变化让人感觉有点令人费解。例如，如何在这里设置“最大值”，您实际上使用的是min()。
.el {
width: 75%;
max-width: 600px;
/* tighter, but the change from max to min feels weird */
width: min(75%, 600px);
}min() 和 max() 函数可以接受两个以上的值，这很酷，但很难记住发生了什么！如果 DevTools 可以在任何给定时间告诉您它选择了哪个值，那就太好了。
.el {
width: min(100px, 25%, 50vh, 30ch);
}您不需要calc()在内部进行数学运算！
.el {
width: min(10vw + 10%, 100px);
}您可能希望设置最小值和最大值是合理的。您可以嵌套这些函数来实现此目的，但使用clamp()实现起来不那么令人费解。
.el {
/* Note we're always using a relative unit somewhere
so that zooming stays effective. */
font-size: clamp(0.9rem, 1vw + 1rem, 2.2rem);
}以下是嵌入的视频
这很好，但是 clamp() 没有必要的浏览器支持，因此无法实现实际使用。
值得注意的是 Safari 完全不支持。
您需要一个后备解决方案，但浏览器支持已经相当不错，包括最新版 Safari 的完全支持
https://caniuse.cn/#feat=css-math-functions
现在可以了！
我一直在尝试使用 clamp()，它确实非常适合流体字体！
不过，关于您使用 font-size 和 clamp() 的示例有一点：因为您的默认大小设置为 1rem+1vw，所以您指定的最小子体大小永远无法达到：0.8rem。vw 单位永远不会为负数，因此实际的最小尺寸（如果屏幕宽度为零像素）将为 1rem，而不是 0.8rem。所以我想您需要将 rem 值设置为与最小值相同
font-size: clamp(0.8rem, 0.8rem + 1vw, 2.2rem);
这有道理吗？
确实如此。我想即使使用
0.8rem + 1vw，也很难完全降到 0.8rem。也许有意义的是只进行一些视觉测试，并选择一个px值，使其感觉尽可能小。在这种情况下，我认为您甚至不需要 clamp。仅 min() 就可以处理这项工作，因为正如您提到的，vw 永远不会为负数。
如果我没记错的话，min(0.8rem + 1vw, 2.2rem) 将产生相同的结果。
您实际上可以将 min 和 max 结合使用，并使用 clump 获得相同的结果。您可以编写 min(23px,max(16px, 23/1280 * 100vw))，其中 23px 实际上是您想要赋予文本的最大字体大小，反之亦然，使用 max 您给出最小尺寸，即 16px。然后你说当你达到 1280px 视口宽度时，取 23px 并开始缩小它们，就是这样，所有浏览器都支持这一点
Jeremy Keith 在 (https://adactio.com/journal/16887) 中写道，使用此代码编译 Sass 时遇到问题，因为 Sass 试图自行执行 50% + 0.66vw 数学运算，这在预编译器中无法工作，因为它不知道 50% 或 0.66vw 是多少
但是有一个解决方法，使用 Sass 插值并在其中放置一个包含计算结果的字符串
伙计，这至少对于字体大小来说是圣杯！世界上所有的浏览器都应该…… **必须**立即实现它！
在 clamp 中，为什么不能给出最小字体大小、最大字体大小、最小屏幕宽度和最大屏幕宽度？这难道不比所有这些数学运算更直接吗？
有趣的想法。但 clamp 不仅限于将基于 vw 的单位作为第二个值。它可以基于百分比或 ch。因此，将最小和最大屏幕宽度作为附加参数在所有情况下都没有意义。
但是，如果您想在给定的视口范围内计算
vw + rem值 - 我们刚刚推出了一款小工具，它可以准确地帮助您做到这一点min-max-value-interpolation-tool
注意：调整浏览器大小时，clamp 不会自动重新调整 - 必须刷新才能应用大小调整。