nav-header类发生了什么？

Question

使用Bootstrap 2.3.2,您可以使用以下nav-header类创建分组列表.

<ul class="nav nav-pills nav-stacked">
    <li class="nav-header">Group A</li>
    <li><a href="/items/1">Item 1</a></li>
    <li><a href="/items/2">Item 2</a></li>
    <li><a href="/items/3">Item 3</a></li>
    <li class="nav-header">Group B</li>
    <li><a href="/items/4">Item 4</a></li>
    <li><a href="/items/5">Item 5</a></li>
</ul>

参考

在Bootstrap 3.0.0中,nav-header该类似乎已被删除,但我找不到任何提及它在文档中被删除.我也找不到替代品.

这种功能还存在吗？如果是这样,那么新的方式是什么？

Answer 1

关于LESS文件和Github项目,nav-list并且nav-header在Bootstrap 3中从未存在过.我想它已经被遗忘了.

你可以使用这种黑客获得类似的行为:

ul {
    width: 300px;
    margin: 20px;
}
.nav > li.nav-header > a {
    cursor: default;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/>
<ul class="nav nav-pills nav-stacked">
    
    <li class="nav-header"><a>Group A</a></li>
    <li><a href="/items/1">Item 1</a></li>
    <li><a href="/items/2">Item 2</a></li>
    <li><a href="/items/3">Item 3</a></li>
    
    <li class="nav-header"><a>Group B</a></li>
    <li><a href="/items/4">Item 4</a></li>
    <li><a href="/items/5">Item 5</a></li>
    
</ul>

将标题包装在a中<a>,添加类.disabled并创建自己的.nav-header类.

编辑 根据这个问题和这个更改日志,nav-list已被替换为list-group,但你没有任何真正的方法来获得标题相同的行为.

Answer 2

即使您的导航列表不是使用dropdown-headercss类的下拉列表也可以.

<ul class="nav nav-pills nav-stacked">
    <li class="dropdown-header">Group A</li>
    <li><a href="/items/1">Item 1</a></li>
    <li><a href="/items/3">Item 3</a></li>

    <li class="dropdown-header">Group B</li>
    <li><a href="/items/4">Item 4</a></li>
    <li><a href="/items/5">Item 5</a></li>
</ul>