Css 不同的浏览器以不同的方式呈现我的网站字体

我在网页中的一个按钮上使用了Avenir黑色字体。但Chrome和Microsoft Edge的表现有所不同

即使我已经清除了这两个浏览器的缓存&检查两个浏览器中的网页，控制台中也没有错误，字体为Avenir Black。有人知道原因吗？我随代码附上了输出的快照

文本编辑器中的按钮代码

如何导入字体

铬检测元件

边缘检测元件

如何链接字体文件

---

这是因为您只使用了一种格式（ttf）作为所需的字体，而不是所有的web浏览器都能阅读。您可以阅读本文了解更多信息。然后，您将了解如何以非常简单的方式修复此问题

但没有一种字体格式在所有浏览器和浏览器版本中都受支持。几乎所有最新的web浏览器都支持TTF和WOFF文件格式（opera mini除外）。作为一名开发人员，如果您使用TTF和WOFF web格式，您的生活将变得更加轻松。但是，您仍然需要有多种字体格式的组合，才能使所有浏览器都支持所有字体

请阅读并创建一个，不要将代码作为图像发布！