用其他图标替换bootstrap导航栏中的icon-bar

Question

当导航栏折叠时，我正在尝试替换导航栏按钮中的三个条形。

原始代码是：

<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </a>

我尝试了以下方法，但它不起作用：

<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
          <span class="icon-envelope"></span>

        </a>

有人可以帮忙吗？

Answer 1

您可以将导航栏切换按钮内的内容替换为您喜欢的任何内容，包括不同的图标或文本。这是一个带有信封图标的工作示例：
http://jsfiddle.net/panchroma/RWPdu/

你会发现HTML中没有任何异常，所以如果它仍然不适合你，你可以通过测试页面正文中的图标来检查是否正确安装了glyphicons。你还可以检查它是不是颜色问题 - 例如白色背景上的白色文字。

祝你好运！

<div class="navbar">
<div class="navbar-inner">
<div class="container">

  <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
  <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

      <span class="icon-envelope"></span>
  </a>

  <!-- Be sure to leave the brand out there if you want it shown -->
  <a class="brand" href="#">Project name</a>

  <!-- Everything you want hidden at 940px or less, place within here -->
  <div class="nav-collapse collapse">
    <!-- .nav, .navbar-search, .navbar-form, etc -->
  </div>

 </div>
 </div>
 </div>