java - 下拉菜单显示在 md 和 lg 中，不知道如何修复它(Bootstrap 3.6.6)

Question

Everything is fine in sm

But when it comes to md and lg, this happens

#chicken {

background-color: rgb(52, 58, 58);

color: whitesmoke;

padding: 15px;

margin-bottom: 15px;

}

#chicken h6 {

font-size: 1.5em;

}

#titulo {

clear: right;

}

#butao {

background-color: rgb(207, 250, 248);

}

#header {

background-color: teal;

}

<nav id="header" class="navbar navbar-default">

  <div class="container">

    <div class="navbar-header">

      <!--titulo-->

      <h1 id="titulo">Food, LLC</h1>

      <!--butao-->

      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#butao" aria-expanded="false">
    
    <span class="sr-only">Toggle navigation</span>
    
    <span class="icon-bar"></span>
    
    <span class="icon-bar"></span>
    
    <span class="icon-bar"></span>
    
    </button>

    </div>

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

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

        <li>Chicken</li>

        <li>Beef</li>

        <li>Sushi</li>

      </ul>

    </div>

  </div>

</nav>

我应该有一个大桌面和一个中等平板电脑的 View ，上面没有浅蓝色，只有较暗的颜色，并且上面没有“ChikenBeefSushi”。我使用 Bootstrap 3.3.6，因为这是老师使用的版本，并且它仅适用于该版本。我的代码和他的一模一样，但是他的代码可以工作，但我不知道该怎么办!

Answer 1

md 和 lg 是 Bootstrap 不固定大小

md = 适用于中型屏幕

lg = 大屏幕

而且它们是 float 的，所以你需要clearfix

如果你想使用尺寸，它可以在CSS中使用，例如

 font-size : 16 px;
 width : 200px;
 width : 20%; 

......

希望这对您有帮助