使用Twitter Bootstrap 3的社交按钮

Question

我试图在我的网站上添加一些社交按钮，样式是正确的但图标不会出现。我认为这一定是Font Awesome的一个问题，因为图标来自哪里，但我无法看到我出错的地方。

我把它连接起来就像这样：

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

和身体中的按钮如下：

<div id="contact_page">
  <div class="container">
    <div class="row">
      <div class="span4 pull-center">
        <button class="btn btn-twitter"><i class="icon-twitter"></i> | Connect with Twitter</button><br>
        <button class="btn btn-linkedin"><i class="icon-linkedin"></i> | Connect with LinkedIn</button><br>
      </div>
    </div>
  </div> 
</div>

Answer 1

由于您正在尝试使用Font Awesome 4.0.3，因此您必须使用最新的类名来使其正确。而不是icon-*，您必须使用fa fa-*（official examples中的更多更改）

在您的情况下，将<i>更改为：

<i class="fa fa-twitter"></i>
<i class="fa fa-linkedin"></i>

如果你想拥有比图标和简单分隔符更高级的东西，你可以查看Social Buttons for Bootstrap（免责声明：我是创作者），它与最新版本配合得很好，如果你有很好的灵活性想要添加更多。

Answer 2

可能你没有这些课程。

检查一下： Social buttons for Bootstrap

或这个例子： Social media icons with font awesome