css - 当视口(viewport)宽度减小时增加字体大小

Question

我想知道是否有一个 CSS 命令允许在视口(viewport)宽度变小时增加字体大小(如反向钳制方法)。事实上，我想做与 clamp 相反的事情(因为第一个条目是 MIN 值)。我在互联网上搜索没有成功。提前感谢您的反馈。

Answer 1

您可以使用 calc 根据视口(viewport)的宽度从字体大小中减去，这将为您提供所需的反向缩放。

然后您仍然可以根据需要使用带有最小/最大值的钳位。

将下面的代码片段作为整页运行。

h1 {
 font-size: clamp(10px, calc(100px - 5vw), 100px); 
}

<h1>Heading 1</h1>