FontAwesomeのアイコンが表示されない時、確実な方法があった。

やっぱりこれも擬似要素を使います。

=css=

time::before {
  content: '\f017';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 2em;
  line-height: 1.5;
}

簡単に表示されそうなものだけど、プラグインを入れていたとしても表示されなくて困った。

とにかくFont Awesomeは、アイコン画像というより文字として認識した方が理解できるとわかりました。

★FontAwesomeでアイコンが□（四角）になって表示されない場合の対策まとめ（:after:before利用時）

ついでに、バックスラッシュ(\)を入力する方法です。

英数入力にして

option(alt)キー＋￥