Bootstrap 4 个以 xs 宽度折叠的响应式导航栏?
Bootstrap 4 responsive navbar that collapses at xs width?
我试图找到 bootstrap 4 响应式导航栏的示例,它仅在 xs 宽度处折叠为汉堡包按钮,但在更宽时完全可见。
有一个 bootstrap 3 example 可以正常工作,但我找不到 4 个。
bootstrap 4 导航栏示例页面显示了一个 collapsed content 版本,但它在所有宽度处都已折叠。
下面提示了如何使用 .navbar-toggler 等使其工作。其他
For more complex navbar patterns, like those used in Bootstrap v3, use the .navbar-toggleable-* classes in conjunction with the .navbar-toggler. These classes override our responsive utilities to show navigation only when content is meant to be shown.
我的 bootstrap 知识很少,所以如果已经有批准的方法来执行此操作,我不想与框架对抗任何解决方案。
编辑:
实际上,bootstrap 4 文档中 Collapsible content 下面的响应式导航栏示例使用 navbar-toggleable-xs 完全符合我的要求class。我没有早点看到它,因为我没有把 window 设置得足够窄。
Bootstrap 4 稳定:
在稳定版中navbar-toggleable-*
已重命名为navbar-expand-*
,但-xs
中缀被(仍然)移除,所以在你的情况你应该使用 navbar-expand
.
文档中的解释:https://getbootstrap.com/docs/4.1/components/navbar/#how-it-works
仅适用于 Bootstrap 4 alpha:
实际上,Bootstrap 4 文档中 Collapsible content 下面的响应式导航栏示例完全符合我使用 navbar-toggleable-xs
class 寻找的内容。我没有早点看到它,因为我没有把 window 设置得足够窄。
在 Bootstrap 4 alpha 6 中,现在只是 navbar-toggleable
没有 -xs
。
编辑:文档link现在在这里:http://v4-alpha.getbootstrap.com/components/navbar/#nav
我试图找到 bootstrap 4 响应式导航栏的示例,它仅在 xs 宽度处折叠为汉堡包按钮,但在更宽时完全可见。
有一个 bootstrap 3 example 可以正常工作,但我找不到 4 个。
bootstrap 4 导航栏示例页面显示了一个 collapsed content 版本,但它在所有宽度处都已折叠。
下面提示了如何使用 .navbar-toggler 等使其工作。其他
For more complex navbar patterns, like those used in Bootstrap v3, use the .navbar-toggleable-* classes in conjunction with the .navbar-toggler. These classes override our responsive utilities to show navigation only when content is meant to be shown.
我的 bootstrap 知识很少,所以如果已经有批准的方法来执行此操作,我不想与框架对抗任何解决方案。
编辑:
实际上,bootstrap 4 文档中 Collapsible content 下面的响应式导航栏示例使用 navbar-toggleable-xs 完全符合我的要求class。我没有早点看到它,因为我没有把 window 设置得足够窄。
Bootstrap 4 稳定:
在稳定版中navbar-toggleable-*
已重命名为navbar-expand-*
,但-xs
中缀被(仍然)移除,所以在你的情况你应该使用 navbar-expand
.
文档中的解释:https://getbootstrap.com/docs/4.1/components/navbar/#how-it-works
仅适用于 Bootstrap 4 alpha:
实际上,Bootstrap 4 文档中 Collapsible content 下面的响应式导航栏示例完全符合我使用 navbar-toggleable-xs
class 寻找的内容。我没有早点看到它,因为我没有把 window 设置得足够窄。
在 Bootstrap 4 alpha 6 中,现在只是 navbar-toggleable
没有 -xs
。
编辑:文档link现在在这里:http://v4-alpha.getbootstrap.com/components/navbar/#nav