【问题标题】:Bootstrap icon-bar not showing引导图标栏未显示
【发布时间】:2013-10-06 08:06:57
【问题描述】:

调整浏览器大小时,Bootstrap 导航栏菜单中的图标栏不显示:

http://jsbin.com/ixAqinA/1/

   <section class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a href="/">
        brand
      </a>
    </div>
    </section>

您可以现场查看 JSBin 示例:http://jsbin.com/ixAqinA/1/

【问题讨论】:

  • 添加图标类“请解释一下”是什么意思
  • 是的,我试过了,但还是不行,你可以在例子中测试一下!

标签: javascript jquery html css twitter-bootstrap


【解决方案1】:

你必须把它包起来

<nav class="navbar navbar-default" role="navigation"></nav>

【讨论】:

  • 对不起,这只是眼睛的问题:图标栏实际上在那里,但它像背景一样用白色着色,所以我看不到它,你的回答也解决了问题,谢谢你
【解决方案2】:

我遇到了类似的问题,但由于 Bootstrap 的更改,此解决方案对我不起作用。

对于 Bootstrap 3.1.1,我需要以下样式来显示固定在顶部的自定义彩色导航栏上的图标栏(因此 .navbar-default 不起作用)

.navbar-toggle .icon-bar{ background-color: #fff;}

只需将#fff 更改为您想要显示的颜色即可。

【讨论】:

    【解决方案3】:

    Bootstrap 4 不再使用.icon-bar。 在那里必须这样做:

    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>
    

    有关更多详细信息,您应该查看heredocumentation of Bootstrap 4

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-07-20
      • 2021-08-09
      • 1970-01-01
      相关资源
      最近更新 更多