时间戳

首页 > 解决方案 > 如何为导入的 ccs 库添加样式？

javascript - 如何为导入的 ccs 库添加样式？

问题描述

我尝试改进我的网站https://agariogame.club/的 GooglePageSpeed，但我遇到了一个问题（避免显示不可见的文本）。文本 问题出在我使用的库中。我将 Cloudflare 中的它与代码一起使用。

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

为了解决这个问题，我需要将它添加到库中。

font-display: swap;

这个库使用我有问题的字体。 文本

如何添加“字体显示：交换；” 解决问题？

我有建议如何解决。只需下载并修复它，在本地使用。但是会降低性能。

标签： javascriptcssfontsfont-awesomecloudflare

解决方案

您可以下载 font-awesome 的桌面版本并使用它。它还将提高速度，因为您只能以 SVG 方式使用您想要的图标。

为此，您需要添加CSS名为的文件all.min.css（这将与 font-awesome 的下载一起提供）。该all.min.css文件应该在一个名为的文件夹css中，并且在该文件夹之外，您应该有另一个名为的文件夹webfonts（您将通过字体真棒下载获得它）。

要下载访问：https://fontawesome.com/download在首页上，您将获得两个下载选项，一个用于网络/下载，第二个用于桌面。您将下载网络版本。桌面版仅包含 SVG。您将获得一个 zip 文件，其中包含您需要的所有必需文件。

文件夹放置：

主文件夹——

文件夹 1 - css：文件（1）：all.min.css

文件夹 2 - webfonts：文件（15）：......

推荐阅读