引导冲突引导真棒字体图标答案

【问题标题】：bootstrap conflicts bootstrap awesome font icons引导冲突引导真棒字体图标
【发布时间】：2017-04-26 11:03:40
【问题描述】：

我对 bootstrap 和 bootstrap Awesome 字体有疑问。<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 当我把这些放在一起时，有些东西不起作用。如果我删除例如引导程序，字体真棒正在工作。我正在尝试添加这样的社交媒体按钮：social media buttons 它正在工作，但没有引导程序。但是当我添加引导程序时，我失去了导航栏：broken buttons when add bootstrap。抱歉我的错误解释我是新来的:) 任何帮助将不胜感激。

【问题讨论】：

标签： twitter-bootstrap-3 conflict font-awesome-3.2

【解决方案1】：

您是否尝试过先实现 bootstrap，然后再实现 bootstrap awesome ？

如果 css 类具有相同的名称，它们会根据最后定义的类相互覆盖。例如，当我首先添加带有 .emoticon 类的 bootstrap.css，然后添加一个也具有 .emoticon 类的 custom.css 文件时，它将使用最后一个的实现。

希望这会有所帮助！

【讨论】：

是的，我试过了，但还是没有。我一定是错过了什么 -.- 还是谢谢你。

【解决方案2】：

我建议下载引导程序并在本地实现。这将解决问题，如果我没有弄错问题原因是 integrity, crossorigin 属性。

【讨论】：

【解决方案3】：

将 font-awesome 和 bootstrap 的代码复制到新的 css 文件而不是 cdn 中。在您的 Index.html 中包含 bootstrap.css 和 font-awesome.css，它会起作用。

【讨论】：