某些字体很棒的图标无法显示

时间:2013-03-21 19:04:21

标签: twitter-bootstrap font-awesome

我可以看到icon-screenshot,icon-map-marker被渲染得很好但是在使用图标纸夹或图标组或图标链接时看不到任何东西......可能是什么错误?这里有人经历过同样的问题吗?

2 个答案:

答案 0 :(得分:3)

基于official troubleshooting guide这些是您应该检查的内容:

常规

  • 您的系统上没有安装旧版本的Font Awesome(它可能具有优先级);
  • [如果您从自己的服务器提供Font Awesome]您的font-awesome.css文件和/ fonts文件夹都是最新的;
  • [如果您从CDN提供Font Awesome]您的css链接是最新的;
  • 您没有使用加载旧版/修改版Font Awesome的插件/扩展程序;
  • 您使用的是有效的HTML5模板;
  • 您的浏览器的开发控制台显示您正在加载正确的字体文件;
  • 您的浏览器扩展程序未阻止webfonts(noscript,adblockplus等)。

IE特定

  • Internet Explorer兼容模式可能会导致一些问题。通过添加到您的头部来禁用它:

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

  • 如果您使用的是IE8,则需要添加html5.js脚本,如:

    <!--[if lt IE 9]> <script src="http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js"></script> <![endif]-->

  • FontAwesome与ie7-js不兼容。

  • 除非将字体设置为“可安装嵌入”模式,否则Internet Explorer会生成错误。 More info

Wordpress特定

  • Wordpress会在行尾自动添加<br>标记,这会破坏图标堆栈。请将您的html放在一行或添加到样式表中:

    .fa-stack br { display: none }

答案 1 :(得分:2)

在升级fontawesome版本时,请确保替换css文件和字体。如果将fonts文件夹放在不同的位置,则还需要更新css文件中的路径。