为什么字体真棒图标显示空方块？

【问题标题】：Why font awesome icon shows empty squares?为什么字体真棒图标显示空方块？
【发布时间】：2020-03-24 12:31:59
【问题描述】：

我想通过 FA 堆栈组合图标，但它不起作用。我有来自文档的纯示例，它只显示空方块。代码如下：

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<span class="fa-stack" style="vertical-align: top;">
    	<i class="far fa-circle fa-stack-2x"></i>
    	<i class="fas fa-flag fa-stack-1x"></i>
    </span>

结果如下图所示（行中的最后一个图标）。我究竟做错了什么？

【问题讨论】：

标签： css font-awesome font-awesome-5

【解决方案1】：

使用正确的 CDN，它是 V5 而非 V4 之一

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.0/css/all.css">

<span class="fa-stack" style="vertical-align: top;">
    <i class="far fa-circle fa-stack-2x"></i>
    <i class="fas fa-flag fa-stack-1x"></i>
</span>

【讨论】：

是的版本错误，但这个例子也不起作用。还是一样的空方块。
@Čamo 如果你运行上面的 sn-p，你会看到空方块吗？
对不起，我的错。我的实验部分是像 *:not(.fa) { font-family: Arial; } 这样的 css 代码，它导致了这个问题。