加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

Bootstrap——导航条(navbar)

发布时间:2020-12-17 21:19:17 所属栏目:安全 来源:网络整理
导读:导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多。? 导航条(navbar)中有一个背景色、而且导航条可以是纯链接(类似导航)、表单以及表单和导航一起结合等多种形式。 在制作一个基础导航条时,主要分以下几步: 首先在制作导航的列

导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多。?

导航条(navbar)中有一个背景色、而且导航条可以是纯链接(类似导航)、表单以及表单和导航一起结合等多种形式。

在制作一个基础导航条时,主要分以下几步:

  • 首先在制作导航的列表(<ul?class=‘nav‘>)上添加类名 navbar-nav;
  • 在列表外部添加一个容器(nav),并且使用类名 navbar 和 navbar-default。
  • <nav class="navbar navbar-default"> 
        <ul class="nav navbar-nav">
            <li><a href="#">首页</a></li>
            ...
        </ul>
    </nav>

    ?

    如果我们希望将导航条固定在浏览器顶部或底部,Bootstrap 框架提供了两种固定导航条的方式:

    • 将导航固定在顶部,下面的内容会自动上移
    <nav class="navbar navbar-default navbar-fixed-top">

    ?

    • 将导航补丁在底部
    <nav class="navbar navbar-default navbar-fixed-bottom">

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读