サーバーに Zurb Foundation のアイコンをインストールし、適切な CSS 宣言を他のすべてのアイコンよりも先にロードする最初のスタイルシートとして head に含めました。
<meta name="description=" content="<?php echo $meta_description; ?>">
<link rel="stylesheet" href="foundation-icons/foundation-icons.css" />
サイトが最初に読み込まれるとき、アイコンは表示されません。代わりに、各アイコンの場所に 4 文字のボックスが表示されます。
サイト上の別の内部ページへのリンクの 1 つをクリックすると、アイコンが適切に表示されます (ホームページに戻ったときも含めて)。
これは、ブラウザに関係なく発生しています。最初のページ読み込み時に表示するにはどうすればよいですか?
私が使用しているコードは次のとおりです。
<ul>
<li><a href="#"><i class="fi-social-facebook"></i></a></li>
<li><a href="#"><i class="fi-social-linkedin"></i></a></li>
<li><a href="#"><i class="fi-social-twitter"></i></a></li>
<li><a href="#"><i class="fi-social-google-plus"></i></a></li>
</ul>