引導3導航藥丸，活動類作品後，才單擊已分配的元素

Question

我有下面的代碼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> 

這是我tab-content只是爲了確保href和id是相等的：

<div class="tab-content"> 
    <div class="tab-pane fade in active" id="options"> 
     <%= render 'options' %> 
    </div> 
    <div class="tab-pane fade" id="payments"> 
     <%= render 'payments' %> 
    </div> 
    </div> 

這是多麼的活躍a的外觀是由（基本上這只是充滿了特殊顏色的圓圈）：

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

下面是一個經常a代碼：

.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參與到這個。 你能給我一個方向來檢查我做錯了什麼嗎？提前致謝！

Answer 1

嘗試添加這些CSS：

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

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

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