在导航栏中缩放文本

Question

在the question 中，一位用户（JoseRui Santos）用intesting link. 发表了评论 在这个例子中，用户是如何使文本缩放的？我对导航特别感兴趣。

我有一个在较小屏幕上运行的宽导航。

我只有45分，所以我不能自己问他。

Answer 1

开发者使用vw 作为字体大小的单位。这是对视口宽度的响应。完整说明请参见this article。

您链接的示例中的相关代码是这样的：

body {
    font-size: 1.5vw;
    [...]
}

然后导航中的字体大小基于初始字体大小，使用em 或% 单位，它们与body 字体大小相关，因此它们也会随着视口的宽度会增大和缩小。