1. ホーム
  2. css

Font Awesome 5 フォントファミリーの問題

2023-12-12 05:12:20

質問

bootstrap 4を使ったプロジェクトでFont Awesome 5を統合しました。CSSでフォントを呼び出すと、うまくいきません。 Font Awesome 4では、コードは次のとおりでした。

#mainNav .navbar-collapse .navbar-sidenav .nav-link-collapse:after {
  float: right;
  content: "\f107";
  font-family: "FontAwesome";
}

フォント名を変更しようとしましたが、うまくいきません。

font-family: 'Font Awesome 5 Free'

どのように解決するのですか?

あなたの Unicode が間違っている f107

a::after {
  content: "\f007";
  font-family: 'Font Awesome\ 5 Free';
}
<link href="https://use.fontawesome.com/releases/v5.0.1/css/all.css" rel="stylesheet">
<a>User</a>
<i class="fas fa-shopping-basket"></i>

あるいは別のケースで font-weight: 900; で救われます。font awesome 5 の一部のアイコンは font-weight: 900; .

a::after {
  content: "\f007";
  font-family: 'Font Awesome\ 5 Free';
  font-weight: 900;
}