[解決済み】Font Awesomeが機能せず、アイコンが四角で表示される。

2022-04-01 01:35:59

質問

Bootstrapと新しいFont Awesomeファイルを使って、マーケティングページのプロトタイプを作ろうとしています。問題は、アイコンを使用しようとすると、ページ上にレンダリングされるのは大きな四角形だけだということです。

以下は、headにファイルをインクルードする方法です。

<head>
        <title>Page Title</title>
        <link rel="stylesheet" href="css/bootstrap.css">
        <link rel="stylesheet" href="css/bootstrap-responsive.css">
        <link rel="stylesheet" href="css/font-awesome.css">
        <link rel="stylesheet" href="css/app.css">
        <!--[if IE 7]>
            <link rel="stylesheet" href="css/font-awesome-ie7.min.css">
        <![endif]-->
</head>

そして、これは私がアイコンを使ってみた例です。

<i class="icon-camera-retro"></i>

しかし、すべて大きな四角でレンダリングされます。何が起こっているのか、どなたかご存知ですか？

解決方法は？

によるとドキュメント (ステップ3)では、提供されたCSSファイルを修正して、あなたのサイトのフォントの場所を指すようにする必要があります。

[解決済み】Font Awesomeが機能せず、アイコンが四角で表示される。

質問

解決方法は？

関連

[解決済み] CSS無効なプロパティ値？

[解決済み] Bootstrapコンテナが複数またはネストされていませんか？

[解決済み] アニメーションディレイが効かない

[解決済み] svgの円のダブルストロークの色

[解決済み] テーブルの行にマージンを追加する方法 <tr> [重複]。

[解決済み] three.jsの背景を透明や他の色に変更する。

[解決済み] Font Awesomeで2つ以上のアイコンを重ねる/重ねるには？

[解決済み】Font Awesome アイコンの色、サイズ、シャドウのスタイルを設定する方法

[解決済み】CSSでFont Awesome アイコンを使用する

[解決済み】Font AwesomeのアイコンをCSSのコンテンツとして使用する。

最新

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 実装サイバーパンク風ボタン

おすすめ

[解決済み】div間の空白を削除する

[解決済み】divの重なりについて

[解決済み] CSSでボーダーの不透明度を設定することはできますか？

[解決済み] CSSやSVGで半円を描く

[解決済み] Bootstrap 3でnavbar-static-topは何をするのですか？

[解決済み] モバイル端末でCSSを使用したフルハイトの背景画像

[解決済み] ブートストラップカラムで画像の下にキャプションを中央配置する

[解決済み] CSS 不透明度 - 背景色

[解決済み] FontAwesomeのアイコンが表示されないのですが、なぜですか？[クローズド］

[解決済み] woffファイルで@font-faceが404エラーを投げるのはなぜですか？