Question

我使用默认的bootstrap 3导航条崩溃，但我想知道是否

在导航折叠时是否可以保留导航中的某些项目？（请参阅我的屏幕截图中的示例），不使用Javascript。

现在如何，默认

所需

Answer 1

＆＃13;

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
          <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
           <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
           </head>
           <body>
<nav class="navbar navbar-inverse">
  <div class="container-fluid" id="nav-container">
    <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="#">FUNducation</a>
      <button href="" class="btn navbar-btn pull-right" id="signup">Sign Up</button>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
    
    <ul class="nav navbar-nav navbar-right">
    
      <!--<a href="" ><button class="btn navbar-btn" id="stud">Studier demo</button></a>-->
      <a href="" ><button class="btn  navbar-btn" id="help">CHEERS</button></a>
      <!--<li class="diff"><a class="nav_list" href="testlogin.php">--><!--<span class="glyphicon glyphicon-log-in"></span>--> <!--Sign Up</a></li>-->
      <a href="" ><button class="btn  navbar-btn" id="friend">LOG-IN</button></a>
    </ul>
    
    </div>
  </div>
  </nav>
  </body>
  </html>

＆＃13;

在<div class="navbar-header">中添加撰写按钮。那就是它。

根据Notflip的建议这是解决水平对齐问题的方法。我们都认为这有助于未来的访客。

Check out this fiddle- http://jsfiddle.net/nomis/n9KtL/1/

干杯！

Answer 2

是的，如果你保持＆＃34;撰写＆＃34; nav＆＃34; container＆＃34;之间的按钮上课和外面＆＃34;导航栏崩溃＆＃34;类。

有关详细信息，请分享代码。

Answer 3

仅使用CSS是不可能的。

你必须使用JavaScript。

创建一个默认样式为 display：none; 的元素，当折叠导航时，将该元素的样式设为 display：block;

Bootstrap在崩溃之外保持某些<li>

现在如何，默认

所需

3 个答案: