如何仅使用引导图标?

问题描述 投票:0回答:4

我有一个带有自己的 css 文件的项目。

现在我想使用一些图标。 Bootstrap 图标是一个不错的选择。但是,我只需要图标。我不需要任何其他东西。我转到自定义页面来自定义我的下载。我只选择字形并保留其他文件。但是当我将它导入到我的项目中时,它附带了所有 css,这使我的 UI 变得一团糟。

那么如果我只想使用图标该怎么办?

css twitter-bootstrap twitter-bootstrap-3 glyphicons
4个回答
1
投票

正如上面所建议的,您可以使用 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>

0
投票

因为你想使用 Bootstrap 图标(即 GlyphIcons),你可以在 Bootstrap Components page 上看到它们,并在其 Official page

中查看它们的类以及除了类之外的使用方法

0
投票

尝试fontcut。它将帮助您获得Bootstrap图标的自定义图标集,包括自定义css文件,自定义WOFF文件和自定义WOFF2文件。您所需要的一切都将准备就绪,并且您无需执行任何代码工作。此外,您还可以通过演示文件进行预览。


0
投票

为什么不使用 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 看起来会更有吸引力

© www.soinside.com 2019 - 2024. All rights reserved.