CSS樣式文檔中的最後一個元素

Question

在下面的代碼中，我想特別添加樣式到最後一個「B」的內容。

<div class="A"> 
    <div> 
    I am <span class="B">foo</span>. 
    </div> 
    <div> 
    I like <span class="B">bars</span>. 
    </div> 
    <div> 
    Actually, call me <span class="B">FOOBAR</span>. 
    </div> 
</div> 

我一直在努力

.B:last-of-type { color: red; } 

各階級「B」得到選擇，因爲它使用最後一次出現在它的直接家長子元素。即在它的直接兄弟姐妹

有沒有什麼辦法可以在整個文檔中只選擇最後一次出現「B」？

Answer 1

找到答案！ CSS3 get last element

我在做這個版本，但我發現它很醜，我想這是唯一的方法。我會繼續討論這個問題，看看有沒有人有更好的建議。

Answer 2

試試這個JsFiddle Demo

.A div:last-child .B{ color: red; } 

Answer 3

你可以像下面這樣做

.A div:last-of-type .B { color: red; } 

Fiddle Demo

或

.A div:last-child .B { color: red; } 

Fiddle Demo

Answer 4

.A span.B:last-child 
{ 
background:#999; 
} 

Answer 5

.A div:last-child .B:last-child 
{ 
background:orange; 
}