html - 交换字体时的字体过渡

标签 html css performance browser fonts

我从 Google Fonts 加载了一个外部字体。我使用 font-display: swap; 来回退到默认字体,直到加载外部字体。但是,当它交换字体时,转换真的很突然。

有没有一种方法可以将这种字体交换行为转换为淡入淡出转换?

最佳答案

您不能对 font-family 使用过渡或动画。但是,您可以尝试使用两个 div,每个使用不同的字体。默认情况下隐藏第二个 div,然后将第一个 div 的不透明度设置为 0,将第二个 div 的不透明度设置为 1。

关于html - 交换字体时的字体过渡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55001794/

相关文章:

html - NSURLRequest/URLWithString 未加载整个网页文本

html - 使用 flex 自定义选项卡菜单

html - 基于监视器宽度的元素大小

使用 JOIN 的 PHP MySQL 选项

css - 什么对性能更好?几张图片的大小调整到他们的空间,还是只有一张?

jquery错误位置

css - 覆盖 Bootstrap 5 颜色不会改变 btn 颜色类

java - System.currentTimeMillis() 作为 NoSQL 数据库行中的列名(按时间排序)

MySQL "UPSERT"并删除不受影响的行

javascript - 如何让我的 JavaScript 程序运行得更快?