【问题标题】:how can I make this (sticky, full-width) navbar using Bootstrap?如何使用 Bootstrap 制作这个(粘性、全角)导航栏?
【发布时间】:2017-02-12 10:31:12
【问题描述】:

我已经花了好几个小时(我是编码新手)试图复制这个导航栏(https://bootstrapmade.com/demo/MyResume/),但我做不到。 我不确定它是否需要 JavaScript 知识(我只知道 HTML、CSS 和 Bootstrap)。 任何帮助如何做到这一点?

【问题讨论】:

    标签: javascript jquery twitter-bootstrap navbar


    【解决方案1】:

    它被称为“ScrollSpy”。您可以在文档here 中找到它。

    <body data-spy="scroll" data-target="#navbar-example">
      ...
      <div id="navbar-example">
        <ul class="nav nav-tabs" role="tablist">
          ...
        </ul>
      </div>
      ...
    </body>
    $('body').scrollspy({ target: '#navbar-example' })
    

    【讨论】:

    • 感谢 Jacob,这帮了大忙。我只有一个问题:如何使链接居中?我做了这个,但链接或选项卡在左侧,我怎样才能将它们居中?
    • 欢迎您。你可以通过 CSS 类来做到这一点。只需将您的链接放在一个 div 中即可引用此类:".link-wrapper { display:block; text-align:center }" 或者您可以使用此 html 标签:
      并将您的链接放入之间。
    • 再次感谢。我尝试了 CSS 类,但链接实际上是堆叠在一起的
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-11-20
    • 2020-04-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多