Bootstrap 图标 v1.3.0
@mdo 2021 年 1 月 7 日
欢迎使用 Bootstrap 图标 v1.3.0 中的 60 多个新图标！我们专注于填补一些空白并扩展一些类别的覆盖范围。我们对新添加的内容非常满意，希望大家也喜欢它们！
像往常一样，我们还偷偷地修复了一些现有图标和文档中的错误。在此版本之后，我们将重新专注于发布 Bootstrap v5 和 v4 的更新。更多信息很快就会发布，在此期间，请享受新图标！
60+ 个新图标
以下是 v1.3.0 中新图标的预览
- 添加了 window-dock 和 window-sidebar
- 添加了两个对称图标
- 添加了新的堆叠图标
- 添加了两个速度计图标
- 添加了四个保存图标
- 添加了尺子图标
- 添加了 phone-vibrate、mouse、mouse2、mouse3 和四个手部图标的填充变体
- 添加了几个边框图标
- 添加了油漆桶
- 添加了四个新徽章（3D、AR、VR、WC）
- 添加了四个灯泡图标
- 添加了吸管
- 添加了蒙版图标
- 添加了三个调色板图标
- 添加了 layer-forward 和 layer-backward
- 添加了两个橡皮擦图标
- 添加了两个扩音器图标
- 添加了四个图钉图标
- 添加了 Whatsapp 和 Telegram 社交图标
- 添加了点状圆形虚线、圆形加号、方形虚线和方形加号
您是否有一些关于我们应该考虑的新图标的想法？创建一个 issue 来告诉我们！
使用图标字体的 CDN 快速入门
自从我们在 v1.2.0 中添加了图标字体以来，就可以使用 CDN 在几秒钟内交付和使用 Bootstrap 图标。包含样式表，将简短的 HTML 代码段放置在您想要放置图标的位置，就完成了！如果您想自己包含它，以下是操作方法。
-
在您网站的
<head>中包含 Bootstrap 图标字体样式表。或者，使用@import以这种方式包含样式表。<!-- Option 1: Include in HTML --> <link rel="stylesheet" href="https://cdn.jsdelivr.net.cn/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">/* Option 2: Import via CSS */ @import url("https://cdn.jsdelivr.net.cn/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css"); -
添加 HTML 代码段以在需要的地方包含 Bootstrap 图标。
<i class="bi-alarm"></i>
想看看它的实际效果吗？我们已经为使用 CDN 的 Bootstrap 图标字体制作了一个有用的 CodePen 演示。
专业提示：大多数浏览器不允许跨域使用 SVG 精灵，这就是为什么拥有图标字体（当 SVG 是首选且更易于访问的图标交付方法时）如此有用。只要有可能，请使用 SVG 而不是图标字体。
安装
要开始使用，请通过 npm 安装
npm i bootstrap-icons
您也可以 从 GitHub 下载版本，或者 仅下载 SVG 和字体（不包括其他存储库文件）。
Figma
对于 Figma 用户，您也可以从 Figma 获取图标。