html - Bootstrap 3 导航栏高度

Question

我试图将导航栏的高度设置为 40 像素，但是当我设置它并调整网页大小时，下拉菜单无法正常工作。代码:

<nav class="navbar navbar-inverse navbar-fixed-top" id="barranavegacion">
    <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menu" 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>
        <a class="navbar-brand" style="color:white; font-size: 16pt"">Gangatravel               
        </a>
    </div>
    <div class="collapse navbar-collapse" id="menu">
      <ul class="nav navbar-nav">
        <li><a id="texto" href="http://vuelos.gangatravel.es/" target="_blank">Vuelos</a></li>
        <li><a id="texto" href="http://hoteles.gangatravel.es/" target="_blank">Hoteles</a></li>
        <li><a id="texto" href="#">Coches</a></li>
        <li><a id="texto" href="http://rutas.gangatravel.es/es/s/" target="_blank">Rutas</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="http://www.youtube.es/"><img style="max-width: 30px; max-height: 30px; margin-top: -12px;" src="IMAGENES/youtube2.png"/></a></li>  
        <li><a href="http://www.twitter.es/"><img style="max-width: 30px; max-height: 30px; margin-top: -12px;" src="IMAGENES/twitter2.png"/></a></li>  
        <li><a href="http://www.facebook.es/"><img style="max-width: 30px; max-height: 30px; margin-top: -12px;" src="IMAGENES/facebook2.png"/></a></li>    
        <li><a href="https://plus.google.com/"><img style="max-width: 30px; max-height: 30px; margin-top: -12px;" src="IMAGENES/google.png"/></a></li>
      </ul>
    </div>
    </div>
</nav>

#barranavegacion{
background-color:#333; 
border: none;   
height: 40px;}

Answer 1

您的 HTML 有问题 <a class="navbar-brand" style="color:white; font-size: 16pt"">Gangatravel</a>有额外的"

Bootstrap 使用响应式设计。您在全局范围内更改了菜单的高度，而您应该只针对某些屏幕尺寸使用 @media。 CSS查询

这是工作示例 http://jsfiddle.net/kaohLdyg/