Что случилось с классом класса навигации?

С помощью 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, кажется, был удален, хотя я не могу найти упоминания о его удалении в документах. Я также не могу найти замену.

Является ли такая функциональность еще присутствующей? Если да, то какой новый способ?

Ответ 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>

Ответ 2

Несмотря на то, что ваш навигационный список не является выпадающим списком с использованием класса dropdown-header css, он будет работать.

<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>