html - Bootstrap 独立导航图标栏/切换按钮

标签 html css twitter-bootstrap

我希望带有三行的按钮作为一个独立的轮播图像来保存位置。打开切换按钮应该会像往常一样显示菜单。 这是我的导航,显示了整个导航栏条纹。

<nav class="navbar-default navbar-inverse">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
      <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="index.html"></a>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav">

        <li class="dropdown">
            <li><a href="index.html">page 0</a></li>
            <li class="active"><a href="...">page 1</a></li>
            <li><a href="....">page 2</a></li>
            <li><a href="...">page 3</a></li>
      </ul>
    </div>
  </div>
</nav>

任何简单的可能性?只是想使导航栏完全透明。 找到这个codepen .但也许有更好、更原生的替代方案?

最佳答案

您可以在导航中使用“navbar-fixed-top”类,这会将您的导航置于顶部,然后使用自定义 css 使其透明。希望对您有所帮助。

关于html - Bootstrap 独立导航图标栏/切换按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42682363/

相关文章:

css - IE 中的 Calc 函数舍入值并使元素推送到下一行

html - 如何使div顶部居中?

javascript - 单击按钮时更改边框颜色

javascript - 在不重新加载的情况下更改 url 和更新页面内容

具有多个值的 html 类属性(空格分隔)

android - 突出显示 Twitter Bootstrap 按钮的问题

javascript - 如何调用嵌套在表格单元格中的文本区域的属性?

HTML 代码缺少正文

javascript - 如何使图像自动适应容器的最大尺寸?

html - Bootstrap 奇怪的网格对齐