Question

我正在尝试将导航栏的高度设置为40px，但是当我放置它并且我调整网页大小时，下拉菜单无法正常工作。代码：

<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/

Bootstrap 3导航栏高度

1 个答案: