CSS内容中的字体很棒，无法在移动设备上呈现

Question

因此，这是Font Awesome集成作为CSS内容伪元素的基本示例：

ul {
  list-style: none;
}
li:before {
  content: '\f105';
  font-family: 'FontAwesome';
  margin-right: 1rem;
}

<ul>
  <li>Item</li>
  <li>Another item</li>
  <li>Yet another item</li>
</ul>

要测试的外部URL：https : //jsfiddle.net/1zknmxLg/2/

一切都可以与以前的Font Awesome版本一起使用，但是该版本不能在任何手机上渲染图标（在iPhone 7和最新的Android上进行了测试）。

任何帮助，将不胜感激。

Answer 1

浏览完文档后，正确的用法是：

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

如果您使用的是付费（专业版）版本，请用专业版（或品牌）替换“免费”。font-weight: 900;代表实心图标。