我的Bootstrap 3 navbar是一个大视口的1行。然后,当我开始收缩浏览器窗口时,它切换到2行,其中正确的内容(“Hello用户名”,“注销”)在第二行。
然后再调整大小后,它变成1行,菜单项目消失,菜单按钮仅存在。
如何跳过2行阶段?
解决方法
折叠导航条,仅菜单按钮和水平2或1行导航条之间的点(屏幕宽度)由grid-float-breakpoint定义。
将此值设置为较高的值,默认值为768px将跳过2行fase。尝试992px,中间网格的边界。
要更改grid-float-breakpoint,您将有两个选项:
>从github下载源代码,在variables.less中更改@ grid-float-breakpoint并重新编译引导程序
>使用customizer和下载你自己的副本
参见:http://stackoverflow.com/a/18944192/1596547
更新
通过cvrebert on https://github.com/twbs/bootstrap/issues/11539#issuecomment-28805244:
您的选择是:
- change the grid float breakpoint so that the navbar stays collapsed until the screen is wide enough for your big navbar
- use 07004 to hide some parts of the navbar at narrower screen widths so that it fits at those widths
- rework your navbar items so that they’re shorter / less verbose