如何選擇這個一般的兄弟姐妹？

我只想選擇.ul-two li a。但是，當我通過這個選擇器.ul-two li > a設置這個樣式時，這也會影響.ul-three a。我怎樣才能做到這一點？如何選擇這個一般的兄弟姐妹？

<ul class="ul-one"> 
    <li>List 1 
    <a href="#">dropdown 1</a> 
    <ul class="ul-two"> 
     <li>lorem 2 
     <a href="#">I want to only select this link</a> 
     <ul class="ul-three"> 
      <li>lorem 2 
      <a href="#">dropdown 3</a> 
      </li> 
     </ul> 
     </li> 
     <li>Lorem 2 2</li> 
    </ul> 
    </li> 
</ul>

來源

2017-08-04 Riyad

使用.ul-two > li > a代替：

.ul-two > li >a { 
 
    color: red; 
 
}

<ul class="ul-one"> 
 
    <li>List 1 
 
    <a href="#">dropdown 1</a> 
 
    <ul class="ul-two"> 
 
     <li>lorem 2 
 
     <a href="#">I want to only selected this link</a> 
 
     <ul class="ul-three"> 
 
      <li>lorem 2 
 
      <a href="#">dropdown 3</a> 
 
      </li> 
 
     </ul> 
 
     </li> 
 
     <li>Lorem 2 2</li> 
 
    </ul> 
 
    </li> 
 
</ul>

你使用的是什麼，.ul-two li > a，意味着選擇任何錨這是一個列表項的孩子是一個後裔（不只是孩子）的任何無序列表。通過在無序列表和列表項目.ul-two > li > a之間添加子選擇器>，您將後代限制爲僅子項。

來源

2017-08-04 13:45:58 j08691

.ui-three下a元素也正在.ui-two所以你選擇器獲取每次元素的.ui-two Li元素孩子的第一個孩子。

嘗試按如下方式使用選擇：

.ui-two > li > a

來源

2017-08-04 13:46:38

如何選擇這個一般的兄弟姐妹？

回答

相關問題