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;
}
関連
-
[CSSチュートリアル】CSSスコープ(スタイル分割)の使い方まとめ
-
[css3]css3はtransform-originを使用して、大きな円上のドット分布のレイアウトと回転を実現します。
-
[CSSチュートリアル】CSSの新機能には、ページの再描画や並び替えの問題をコントロールする機能が含まれています。
-
[CSSチュートリアル】ピュアCSSで実装した通知バーの3種類のスクロール効果
-
[CSSチュートリアル】インタビュー必見!聖杯レイアウトとダブルウィングレイアウトの違いとは?
-
[CSSチュートリアル】よく使われるnth-childセレクタをまとめる
-
[解決済み] コンテナの幅に応じたフォントの拡大縮小
-
[解決済み] CSS Font Border?
-
[解決済み] 同じフォントに対して複数のフォントファイルを追加する方法を教えてください。
-
[解決済み】iPhoneアプリケーションにカスタムフォントを埋め込むことはできますか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[CSSチュートリアル】よくある2D変換を5つ実現するCSS
-
[CSSチュートリアル】CSS たった1行のコードでアバターと国旗の一体化を実現
-
[CSSチュートリアル】 css border add four corners コード
-
[CSSチュートリアル】resizeで画像のプレビューを切り替える方法
-
[CSSチュートリアル】position:stickyでトップ吸い上げアプレット問題を完璧に解決
-
[CSSチュートリアル]CSSは、メソッドのさまざまな記事の分割行のスタイルの要約を達成するために
-
[CSSチュートリアル】CSS3で3つの効果例の背景をぼかす。
-
[css3]css3アニメーションマウスが絵の上に置かれると徐々に大きくなり、マウスが絵から離れると徐々に縮む効果
-
[CSSチュートリアル】CSSで実現できるのなら、わざわざJavaScriptを使う必要はない
-
[css3]本のページをめくるような効果を実現するcss3サンプルコード