Font Awesome 5部分Unicode图标生效部分失效问题求助

问题原因 #

• 核心原因是 Font Awesome 5 免费版对不同风格的图标有字重要求：Solid 风格图标必须设置font-weight: 900才能正常渲染，Regular 风格图标仅需设置font-weight: 400。你可正常显示的\f2b5属于免费 Regular 风格，缺省字重也能被浏览器匹配到，而无法显示的\f061属于 Solid 风格，缺少对应字重设置就会渲染失败。
• 你贴出的CSS代码存在语法不规范问题，每行属性结尾漏写了分号，部分浏览器对这类错误的容错性差，也可能导致样式不生效。

修正后的代码 #

li::before {
   font-family: 'Font Awesome 5 Free';
   font-weight: 900;
   content: '\f061';
}

如果后续使用其他 Regular 风格的免费图标，把font-weight属性值改为400即可。

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