我有一个带有自己的 css 文件的项目。
现在我想使用一些图标。 Bootstrap 图标是一个不错的选择。但是,我只需要图标。我不需要任何其他东西。我转到自定义页面来自定义我的下载。我只选择字形并保留其他文件。但是当我将它导入到我的项目中时,它附带了所有 css,这使我的 UI 变得一团糟。
那么如果我只想使用图标该怎么办?
正如上面所建议的,您可以使用 font Awesome 并可以访问所有 FA 图标,而无需包含引导样式,只需包含
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
创建图标:
<i class="fa fa-car"></i>
因为你想使用 Bootstrap 图标(即 GlyphIcons),你可以在 Bootstrap Components page 上看到它们,并在其 Official page
中查看它们的类以及除了类之外的使用方法尝试fontcut。它将帮助您获得Bootstrap图标的自定义图标集,包括自定义css文件,自定义WOFF文件和自定义WOFF2文件。您所需要的一切都将准备就绪,并且您无需执行任何代码工作。此外,您还可以通过演示文件进行预览。
为什么不使用 Bootstrap 图标,只需在 Html 文件中使用 CDN
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
使用图标标签并写下图标名称,您可以在https://icons.getbootstrap.com/
上获得令人惊叹的引导图标<i class="bi bi-trash3-fill"></i>
您可以根据您的 UI 轻松进行样式设计
<i class="bi bi-trash3-fill" style="font-size:48px;color:red;"></i>
它需要一些步骤,你的 UI 看起来会更有吸引力