Font Awesome＆＃39; fa-life-ring＆＃39;没有表现出来

Question

问题

fa-life-ring 拒绝在以下代码中显示。我已尝试删除fa-5x，删除text-align: center;但没有任何帮助。我还尝试了另一个图标，然后就可以了。

代码

  <div class="row">
    <div class="col-sm-4" style="text-align: center;">
      <i class="fa fa-file-text fa-5x"></i>
      <h3>Quotes</h6>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse semper ipsum ut commodo tristique.</p>
      <a href="#" class="btn btn-default">Quotes</a>
    </div>

    <div class="col-sm-4" style="text-align: center;">
      <i class="fa fa-life-ring fa-5x"></i>
      <h3>Support</h6>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse semper ipsum ut commodo tristique.</p>
      <a href="#" class="btn btn-default">Support</a>
    </div>
  </div>

截图

修改

使用其他图标可以正常工作。

Answer 1

问题很可能出在您正在使用的Font Awesome版本上。您需要使用4.1.0的最新版本。如果您使用的是旧版本，则该图标尚未添加。这是一个小提琴，显示它使用最新版本。

小提琴：http://jsfiddle.net/mcfarljw/5Ecgq/

您可以使用以下CDN测试最新版本：

//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.css

Answer 2

我遇到了同样的麻烦，这是我的解决方案。我以前从GitHub下载了FontAwesome软件包并直接从他们的网站上下载，这个“fa-life-ring”或“fa-support”图标没有正确显示给我。奇怪的是，这个图标在Safari中显示为OK，但在Chrome或Firefox或IE中没有显示。

所以我去了这个CDN网址： //cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.css

抓住这个CSS文件中引用的字体文件（EOT，SVG，TTF和WOFF） - 实际托管在其CDN上的字体文件 - 并替换了我的Web服务器上的字体文件。 （P.S.我只在本地开发的Web服务器上测试过。）

Et瞧，现在它有效了。我能得出的唯一结论是GitHub与他们的CDN之间略有不同。