我的 bootstrap 图标徽标显示为正方形

My bootstrap icons logo is appearing square

我也包含了我的 Boostrapmin 和 bootstrap 图标 CSS。

                <i class="bi bi-play-circle"></i>

我正在尝试使用这个图标。但它显示为正方形。 css 已应用 我可以在 google chrome.

的检查元素中看到它

我也包含了我的 Boostrapmin 和 bootstrap 图标 CSS。

                <i class="bi bi-play-circle"></i>

我正在尝试使用这个图标。但它显示为正方形。 css 已应用 我可以在 google chrome.

的检查元素中看到它

所以,我在这里写一个解决方案感谢@zim的帮助。


第一步: 下载 Bootstrap 图标 CSS 文件,bootstrap-icons.css Link 它在你的项目中 --通过包含在CSS文件中 --通过 linking 在 HTML 文件中。

之后从 Bootstrap 图标 git 存储库下载字体文件夹。 --现在打开bootstrap-icons.css 你会发现这样的代码

@font-face {
  font-family: "bootstrap-icons";
  src: url("../fonts/bootstrapfonts/bootstrap-icons.woff2") //Match this file path format("woff2"),
    url("../fonts/bootstrapfonts/bootstrap-icons.woff") //Match this file pathformat("woff");
}

-bootstrap-icons.woff2bootstrap-icons.woff 确保你 link 它正确使用 bootstrap-icons.css 文件。 祝你一切顺利..:)