引導導航丸 - 「主動」類開啓模式不起作用

我有以下爲nav-pills組件代碼：引導導航丸 - 「主動」類開啓模式不起作用

<ul id="steps" class="nav nav-pills form-steps"> 
    <li class="active"><a data-toggle="pill" href="#options"></a></li> 
    <li><a data-toggle="pill" href="#payments"></a></li> 
    </ul>

這是多麼的活躍a的外觀是由（基本上這只是填補了一圈用特殊顏色）：

.form-steps > li.active > a { 
    background-color: #931f2a; 
}

下面是一個經常a代碼：

.promoter-form-steps > li > a { 
    border: 2px solid #931f2at; 
    height: 30px; 
    width: 30px; 
    border-radius: 100%; 
}

我猜想通過添加.active類到相應的li元素使得a元素充滿了顏色，但是當我打開第一次放置此元件的模式時，它不會。當我點擊另一個鏈接後第二次打開模態時，我看到正確的行爲，即.active類中充滿了顏色。這是一個SPA，我有另一個nav-pills這樣的確切標記，它的工作原理很好，我不明白爲什麼這種行爲不適用於第二個nav-pills。我再次檢查了類名和ID不重複，我相信沒有自定義js參與到這個。你能給我一個方向來檢查我做錯了什麼嗎？提前致謝！

來源

2017-08-07 Michael Spiegelberg

這裏是由Twitter的文件確定的推薦格式：

<ul class="nav nav-pills"> 
    <li class="nav-item"> 
    <a class="nav-link active" href="#">Active</a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link" href="#">Link</a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link" href="#">Link</a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link disabled" href="#">Disabled</a> 
    </li> 
</ul>

你的列表標記都需要有一個類導航項和你的錨需要一個類導航鏈接的，纔可以使用活動類

來源

2017-08-07 16:59:07

Hello Jacob，感謝您花時間解決我的問題。不幸的是，你的方式不適合我。我更新了一些問題以提供更多細節。 –

引導導航丸 - 「主動」類開啓模式不起作用

回答

相關問題