Bootstrap导航栏

bootstrap创建导航栏

第一步新建<nav>标签,带上class navbar和navbar-default。role=navigation增加可访问性。

第二步新建一个<div> class为container-fluid(这样避免有间距)

第三步新建两个div(两者为平级){

   第一个div class为navbar-header 为导航栏的标题 

          <a herf="#" class=navbar-brand>CSDN创作中心</a>/*navbar-brand可以放大字体并且有一定的css样式*/

   第二个div 放置ul标签 为导航栏的其他元素 ul带class .nav和.navbar-nav

      <ul>

         <li><a href="#>JAVA</a></li>

         <li><a href="#>JS</a></li>

         <li class="dropdown">

              <a href="#" class="dropdown-taggle" data-toggle="dropdown">

                   JAVA

                   <span class="caret'></span>

              </a>

               <ul  class="dropdown-menu">

                     <li><a href="#">LINK</li>

                     <li class="divder"></li>

              </ul>

        </li>

     </ul>

}


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值