为了账号安全,请及时绑定邮箱和手机立即绑定

怎样将导航条中的部分导航右置

我的代码是这样的:

<nav class="navbar navbar-default" role="navigation">
   <div class="container">
    <div class="navbar-header">
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
     <span class="sr-only">Toggle navigation</span><span class="icon-bar"></span>
     <span class="icon-bar"></span><span class="icon-bar"></span></button>
     <a class="navbar-brand" href="#">现代浏览器博物馆</a>   

    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
     <ul class="nav navbar-nav" style="font-size:25px;">
      <li  id="one" class="active"><a href="#">Link</a></li>
      <li id="two"><a href="#">Link</a></li>
      <li class="dropdown">
       <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<span class="caret"></span></a>
       <ul class="dropdown-menu" role="menu">
        <li><a href="#" >Action</a></li>
        <li><a href="#">Action</a></li>
        <li class="divider"></li>
        <li><a href="#">Action</a></li>
       </ul>
      </li>
     </ul>
    
    </div>
   </div>
  </nav>

打开的效果如下:

http://img1.sycdn.imooc.com//58f0ca050001c64813620460.jpg

现在我想如下图将部分导航右置,比如将Dropdown右置,应该怎么修改代码呢?

http://img1.sycdn.imooc.com//58f0c1c0000118bd13500460.jpg

正在回答

1 回答

将dropdown单独列出,用navbar-right属性

<ul class="nav navbar-nav navbar-right">

0 回复 有任何疑惑可以回复我~
#1

富百世 提问者

提问好几天了,终于有人回答了。非常感谢!
2017-04-17 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
基于bootstrap的网页开发
  • 参与学习       187669    人
  • 解答问题       734    个

Bootstrap框架的基础教程,学会用Bootstrap前端框架搭建网页

进入课程

怎样将导航条中的部分导航右置

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信