web-dev-qa-db-ja.com

Font AwesomeがInternet Explorer 8に表示されない

私たちは最近、デザインの一部としてFont Awesomeに強く依存するWebサイトを開発しました。 before:contentと提供されたCSSで標準実装を使用しています。

何らかの理由でFont AwesomeがIE8で表示されません。私はかなりの時間をトラブルシューティングとさまざまな修正を試みましたが、運がありませんでした。

私が持っています:

  • EOTのMIMEタイプをapplication/vnd.ms-fontobjectに設定します
  • OTF、TTFのMIMEタイプをapplication/octet-streamに設定します
  • すべてのCSSが読み込まれた後にHTML5Shivを実行しました。
  • ページ読み込み時にCSSまたはDOMをリロードするさまざまな試み

これがウェブサイトです: http://www.tetakere.org.nz -HotlinksボックスはFont Awesomeの良い例です

このウェブサイトにFont Awesomeを表示するための他のアプローチについて何かアイデアはありますか?

15
BaronGrivet

苦痛なトラブルシューティングの後、私はようやくそれを解決しました。

解決策は、HTML5Shivのロードを<head>セクションから</body>タグの直前に移動することでした。

<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</body>
18
BaronGrivet

私はこれが古い質問であることを知っていますが、私はこの問題で多くの問題を抱えていました。

頭を変えた...

私のために働いたのは:

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

これも機能しました(私が言及した最後の答え):

<meta http-equiv="X-UA-Compatible" content="IE=8">

また、( Force IEタグを使用して互換性モードをオフにする )を読んで、そのメタタグを他のすべてのメタタグの上に置き、条件付きIEステートメント。それ以外の場合、メタタグは無効になります。

9
awl19

FontAwesomeをIE8で動作させるためにhtml5shivは必要ありませんでした。 この答え (.eotファイルを再作成して古いファイルを置き換える)で問題が解決しました。

2
Christof

私は自分のApache設定の変更からすべてを試み、運が悪かった.htaccessファイルを試しました。 IE開発ツールでは、「ドキュメントモード」に出くわし、デフォルトはIE7だったので、調査の結果、次のメタタグが見つかりました。

<meta http-equiv="X-UA-Compatible" content="IE=9">

IE 10、9は私のウェブサイトを正しくフォーマットし、すべてのFont Awesomeアイコンを正しく表示します。

それでもIE 8 compatが必要な場合は、これで開始できます。

<meta http-equiv="X-UA-Compatible" content="IE=8">

お役に立てば幸い...

2
prodigerati

IE8を使用している場合は、次のようにhtml5.jsスクリプトを追加する必要があります。

<!--[if lt IE 9]>
  <script     src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<![endif]-->

それは私にとってはうまくいくと確信しています。参照リンク https://github.com/FortAwesome/Font-Awesome/wiki/Troubleshooting#internet-Explorer-compatibility-mode

0
bheru mehta
  1. これをhtaccessに追加しました。 「BrowserMatch MSIE best-standards-supportヘッダーセットX-UA-Compatible IE = 8 env = best-standards-support」
  2. eOTフォントを再変換しようとしています
  3. ドキュメントのコンパクト化モードの変更
  4. usleep関数を試しました
  5. setInterval js
  6. google html5スクリプトを追加
  7. ie8のボディパーツでcssを呼び出す
  8. データアイコンクラスを追加する
  9. 広告疑似要素js
  10. cSSにPNGとSVGフィルターを追加する
  11. サーバーでフォントの種類の権限を確認する

しかし、追加すると最終的に機能します

。sassおよび.less css

ファイル

幸せなコーディング