Question

浏览器崩溃时，我遇到了Bootstrap导航栏的问题。一切正常，内容响应和按钮出现，但是当按下按钮时，链接不会在导航栏品牌下丢失，而是在导航栏品牌旁边的中间对齐。它似乎也没有拿起任何或正确的样式，即字体大小没有减少。知道这是什么吗？我知道这很简单，但我看不到它！

感谢。（下面的正文代码）

  <nav class = "navbar navbar-inverse navbar-fixed-top">


     <div class = "container">

        <div class = "nav-header">
           <a href = "#" class = "navbar-brand">Site Title</a>

           <button type = "button" class = "navbar-toggle" data-toggle = "collapse" data-target = "#navHeaderCollapse">

              <span class = "icon-bar"></span>
              <span class = "icon-bar"></span>
              <span class = "icon-bar"></span>

           </button>

        </div>

        <div class = "collapse navbar-collapse" id="navHeaderCollapse">

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

              <li class = "active"><a href = "#">Home</a></li>
              <li class = "active"><a href = "#">About</a></li>

              <li class = "dropdown active">

                 <a class = "#" class = "dropdown-toggle" data-toggle = "dropdown">Media</a>

                 <ul class = "dropdown-menu">
                    <li><a href = "#">SubOne</a></li>
                    <li><a href = "#">SubTwo</a></li>
                    <li><a href = "#">SubThree</a></li>
                    <li><a href = "#">SubFour</a></li>
                 </ul>
              </li>

              <li class = "active"><a href = "#">Contact</a></li>

              </ul>

           </div>

     </div>

  </nav>

Answer 1

问题是错误的班级名称：

<div class = "nav-header"> 

change to 

<div class = "navbar-header">

http://jsfiddle.net/8pLven4s/

Bootstrap响应式导航栏链接对齐和样式问题

1 个答案: