Nav-başlık sınıfına ne oldu?

Question

Bootstrap 2.3.2 ile gruplandırılmış bir liste oluşturmak için nav-header sınıfını aşağıdaki gibi kullanabilirsiniz. Bootstrap yılında

Reference

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

Ben docs ayında kaldırılacaktır herhangi bir söz bulamıyorum gerçi nav-header sınıf, kaldırılmış gibi görünüyor 3.0.0. Ayrıca bir yedek bulamıyorum.

Bu tür bir işlev hala mevcut mu? Eğer öyleyse, yeni yol nedir?

Answer 1

LESS dosyaları ve Github projesiyle ilgili olarak, nav-list ve nav-header, Bootstrap 3'te hiçbir zaman bulunmadı. Sanırım unutuldu.

Sen bu saldırı türünü kullanarak benzer bir davranışı elde edebilirsiniz:

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>

sınıf .disabled ekleyin bir <a> yılında Üstbilginizi sarın ve kendi .nav-header sınıf oluşturmak.

DÜZENLEME this issue ve this changelog göre, nav-listlist-group almıştır, ancak başlıklar için aynı davranışı almak için herhangi bir gerçek yol yok.

Answer 2

Eğer nav listeniz dropdown-header css sınıfını kullanarak bir açılır menü olmasa da çalışacaktır.

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