Bootstrap 4 与 Font Awesome 的兼容性

Question

Bootstrap4 与 Font Awesome 兼容吗？

Bootstrap 4 刚刚测试，我担心 Font Awesome 甚至没有在 Bootstrap's official "preferred icon set" page.

中列出

Answer 1

Font Awesome 完全独立于 Bootstrap 框架，应该可以在其组件内正常运行。 Bootstrap 4 似乎更喜欢基于 SVG 的图标解决方案，这可能是 Font Awesome 不在他们首选图标解决方案列表中的原因。

话虽这么说 - Font Awesome 5 目前在 2017 年 8 月 15 日的 Beta 2 中。它支持 SVG 图标，所以如果这对你很重要，它可能是一个可以考虑的选项。不过我会注意到； Font Awesome 5 是一项优质服务。

Answer 2

在 Bootstrap 2.x.x 中，Glyphyicons 是图像格式，因此您不能轻易地增加大小、更改颜色、背景颜色等。但是，font-awesome 为您提供可立即自定义的可缩放矢量图标——大小、颜色、阴影，以及任何可以使用 CSS.

的力量完成的事情

Font-awesome 确实是 Glyphyicons 的替代品，它会不时更新新图标。 Fat 和 Mdo 计划将 Font-awesome 集成到 bootstrap 版本 3 中以替代 Glyphicons

Answer 3

以下作品使用 font awesome 5 的 'web fonts' 替代方法而不是 svg。它使用 css 调整图标大小并与 bootstrap 的 btn class.

一起使用

$('i').click(function() {
 $(this).removeClass('fa-sort btn-light')
  .addClass('fa-sort-up btn-primary')
})

i.fas {
 font-size:200px;
}

<i class="btn btn-light fas fa-sort"></i>

Bootstrap 4 compatibility with Font Awesome