当使用2个不同的CSS版本时，我与真棒字体有冲突。我没有尝试使用2个不同的版本，但是我的插件嵌入了一个版本，有时wordpress网站有另一个版本。
我对这个特定示例感兴趣，如果第一个图标都具有相同的内容，为什么不显示它们？
（我已经注意到，如果fa5在页面上首先链接，则它可以正常工作）
什么是最简单的解决方案？
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<link href="https://use.fontawesome.com/releases/v5.0.8/css/all.css" rel="stylesheet"/>
<i class="fa fa-facebook"></i>
<i class="fab fa-facebook-f"></i>https://jsfiddle.net/pfbx5865/1/
最佳答案
可能要同时使用两个库，请记住：样式表加载了后者的“ wins”。首先加载FA5，然后让FA4覆盖FA4类更有意义。然后大多数图标将按预期显示。
下面的代码段说明了如何使用这两个库。每当使用FA4类时，都会呈现FA4样式。每当使用FA5类时，都会呈现FA5样式。如果以相反的方式加载它（首先是FA4），则所有内容均呈现为FA5样式，如果您现在拥有FA5品牌子集（fab）中的FA4图标定义，则该样式将不起作用。
如果交换库的加载（首先加载FA5），则可以。
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<label>Facebook à la 4.7</label>
<i class="fa fa-facebook"></i>
<br>
<label>Facebook à la 5</label>
<i class="fab fa-facebook"></i>