如何正确使用Font Awesome，解决CSS设置图标无法识别显示问题

• 确认已正确引入Font Awesome 5 Free的完整资源包，对应的CSS和字体文件无加载异常。
• 给.adm:before伪类添加font-weight: 900属性，Font Awesome 5 免费版实心图标必须指定900字重才可正常渲染，这是最常见的报错原因。
• 打开浏览器开发者工具检查.adm:before元素的最终计算样式，确认font-family、content、font-weight属性未被其他样式覆盖。

修改后的完整代码如下：

.adm:before {
    content: "\f0e7";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 5px;
}

.adm {
    background: #d6351c;
    border-radius: 3px;
    box-shadow: 0 1px 1px rgb(214, 53, 28), 0 0 2px rgb(214, 53, 28);
    color: #fff;
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 6px;
    margin-top: 2px;
    padding: 4px 6px;
    text-transform: uppercase;
}

内容的提问来源于stack exchange，提问作者Luciano