Twitter bootstrap 随着宽度的增加，不断填充twitter引导导航菜单。

我正在使用默认的Twitter引导响应导航栏（从mobile up开始工作）。我希望菜单能够随着导航栏的宽度不断扩展而不断填充

我当前的导航（非常适合移动应用）

然而，随着宽度的扩大，我想用更多的菜单项填充列表

[ menu item 1 | menu item 2 | menu item 3 | menu item 4 | all items ]

---

Bootstrap有一个“隐藏”类，它将根据大小隐藏元素，并在类的末尾加上后缀。Bootstrap为您提供了在某些断点触发的类：hidden xs、hidden sm、hidden md、hidden lg

因此，在您的场景中，您可以执行以下操作：

<ul>
    <li>Menu Item 1</li>
    <li>Menu Item 2</li>
    <li>Menu Item 3</li>
    <li>Menu Item 4</li>
    <li class="hidden-xs hidden-sm">Item 5</li>
    <li class="hidden-xs hidden-sm hidden-md">Item 6</li>
<ul>

菜单项1
菜单项2
菜单项3
菜单项4
第5项
第6项

基本上，这些类意味着元素将被隐藏，直到它落入隐藏类覆盖的断点范围之外的断点范围，在本例中，最后2个元素的md和lg

或者，Bootstrap有一组“可见”的类，它们的作用正好相反，在这种情况下，您可以将“隐藏”类放在希望始终隐藏的任何对象上，然后应用“可见-[size]-[display property]”类（例如：“可见lg内联”或“可见lg内联块”）当菜单项落在某些断点范围内时显示它们的

<ul>
    <li>Menu Item 1</li>
    <li>Menu Item 2</li>
    <li>Menu Item 3</li>
    <li>Menu Item 4</li>
    <li class="hidden visible-md-inline visible-lg-inline">Menu Item 5</li>
    <li class="hidden visible-lg-inline">Menu Item 6</li>
<ul>

菜单项1
菜单项2
菜单项3
菜单项4
菜单项5
菜单项6

这都是假设您没有尝试根据断点动态地将内容添加到DOM中，并且这些菜单项已经存在于HTML代码中。否则，您将不得不使用自定义Javascript/jQuery脚本来实现这一点

<ul>
    <li>Menu Item 1</li>
    <li>Menu Item 2</li>
    <li>Menu Item 3</li>
    <li>Menu Item 4</li>
    <li class="hidden visible-md-inline visible-lg-inline">Menu Item 5</li>
    <li class="hidden visible-lg-inline">Menu Item 6</li>
<ul>