【问题标题】:Font Awesome Icons not showing up at all字体真棒图标根本不显示
【发布时间】:2014-09-05 10:47:32
【问题描述】:

我正在使用引导程序并且正在使用 chrome。 我将以下代码放入我的 HTML 文件中以导入 FontAwesome。

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

然后放入下面的图标。

<i class="fa fa-search"></i>

什么都没有出现!当我检查元素时,它是一个 0x0 文本。没有高度没有宽度。它根本不显示。

【问题讨论】:

  • 在这里工作正常:bootply.com/mfeJ6QIc5k。确保您从中链接的文件已正确加载。
  • 你可能有别的东西覆盖了你的 CSS,因为 Dan 的代码对我来说很好用
  • 你不仅需要 CSS,还需要字体。
  • 检查控制台或网络控制台;也许你不能链接 maxcdn

标签: html css twitter-bootstrap font-awesome


【解决方案1】:

如果您在本地测试它,请将 http: 添加到您的 href 值的开头。

<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

【讨论】:

  • 我在我的localhost上测试过,链接前不需要输入“http”。
  • 谢谢,成功了!
  • TooJuniorToCode 如果您在本地服务器上测试您的网站是正确的,但是如果您在没有本地服务器的情况下测试您的网站布局,则需要 http。
  • @Sean 我对此有疑问,我使用了 font-awesome 的在线版本,它确实有效。为什么我的本地版本的 font-awesome.min.css 不起作用?这是我从以前的网站复制的。
  • @Sean 我能够确定我需要字体文件夹中的一些东西-fontawesome-webfont 但是我不确定它们的用途。