[英]Bootstrap 3 navbar issue with logo
bootstrap3响应式导航栏和徽标有问题-它在台式机上可以正常显示并且工作正常。 在移动设备上且合拢时,我可以单击按钮,但菜单不会显示-只是水平滚动条。 我被困住了。 这是我的HTML代码
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!-- Bootstrap links --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <div class="container"> <nav class="navbar navbar-default navbar-static-top" role="navigation"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <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-left" href="#"> <img src="" alt="logo" id="sitelogo" /> </a> </div> <div id="navbar" class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-right"> <li><a href="index.php">Home</a></li> <li><a href="what-we-do.php">What We Do</a></li> <li><a href="case-studies.php">Case Studies</a></li> </ul> </div> </div> </nav> </div>
您是否尝试移除
aria-expanded="false" aria-controls="navbar"
增加height: auto!important;
到#navbar
并删除position: absolute;
从#navbar .nav
,那应该可以解决问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.