是否有一个Bootstrap3组件,它只是在断点处折叠菜单,而不添加切换。例如,如果我有一个水平菜单,在桌面上看起来像这样
在屏幕宽度低于768px,我希望它只是堆叠,而不是折叠成这样的切换
有什么想法吗?
8nuwlpux1#
删除collapse按钮和navbar-collapse类。在getbootstrap.com示例中,类似于以下内容的内容应该可以实现此目的:
<!-- Fixed navbar --> <div class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <a class="navbar-brand" href="#">Project name</a> </div> <div> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#about">About</a></li> <li><a href="#contact">Contact</a></li> </ul> </div> </div> </div>
您必须添加一个媒体查询,以确保填充添加到移动的显示中的内容。我做了一个Bootply here,我在其中添加了以下CSS来使它工作:
@media screen and (max-width: 768px) { #wrap > .container { padding-top:200px; } }
1条答案
按热度按时间8nuwlpux1#
删除collapse按钮和navbar-collapse类。在getbootstrap.com示例中,类似于以下内容的内容应该可以实现此目的:
您必须添加一个媒体查询,以确保填充添加到移动的显示中的内容。
我做了一个Bootply here,我在其中添加了以下CSS来使它工作: