CSS在同一個名稱的多個元素中首先選擇

Question

我想在一些具有非唯一類的元素中只選擇一個<a>。 我無法找出正確的選擇器來使它正確。

Fiddle with my HTML and attempted selector

可這僅編輯CSS做什麼？

Answer 1

使用>爲imediate子選擇，並選擇第一個<li>，而不是第一個<a>。

.menu-name-main-menu > ul > li:first-child > a { 
background: red; 
} 

更新小提琴：http://jsfiddle.net/5hjKP/1/

Answer 2

它可以。試試這個：

.menu-name-main-menu>ul>li:first-child>a { 
    background: red; 
} 

所以，這表示，只有選擇。菜單名稱，主菜單的直接孩子UL，那麼只有它這是一個直接的孩子，那麼它裏面的錨的第一個孩子。

Answer 3

您必須指定選擇：

CSS

div.menu-name-main-menu > ul.menu > li.menu__item > a:not(:only-child) { 
    background: red; 
} 

fiddle

Answer 4

不要忘了，你可以用「第n-OF-類型「 ex：

.menu-name-main-menu > ul a:nth-of-type(1){background:red;}