我已经在我的服务器上安装了 Zurb Foundation 图标，并在头部包含了适当的 CSS 声明，作为在所有其他样式表之前加载的第一个样式表。
<meta name="description=" content="<?php echo $meta_description; ?>">
<link rel="stylesheet" href="foundation-icons/foundation-icons.css" />
当网站最初加载时，图标不显示。而是在每个图标的位置显示一个包含 4 个字符的框：
如果我单击我网站上的一个链接到另一个内部页面，则图标将正确显示（包括当我返回主页时）：
无论浏览器如何，都会发生这种情况。我需要做什么才能使它们在初始页面加载时显示？
这是我正在使用的代码：
<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>