我有以下的html代碼。我想在這段代碼中選擇奇數或偶數.menu-item ul元素,它們被放置在無限嵌套格式中。請幫助我...:n-child對於嵌套元素
<nav class='amazing-menu '>
<ul id='menu_container'>
<li class="parent">
<a href="#" class="link">First</a>
<div class="sub-menu">
<ul class="menu-item">
<!-- I want to => background-color: red; -->
<li>
<a href="" class="link">sub-item1</a>
</li>
<li class="parent">
<a href="" class="link">sub-item1</a>
<div class="sub-menu">
<ul class="menu-item">
<!-- I want to => background-color: blue; -->
<li><a href="link">sub-sub-item1</a>
</li>
<li><a href="link">sub-sub-item2</a>
</li>
<li><a href="link">sub-sub-item3</a>
</li>
<li class="parent"><a href="link">sub-sub-item4</a>
<div class="sub-menu">
<ul class="menu-item">
<!-- I want to => background-color: green; AND so on ... -->
<li><a href="link">sub-sub-sub-item1</a>
</li>
<li><a href="link">sub-sub-sub-item2</a>
</li>
<li><a href="link">sub-sub-sub-item3</a>
</li>
<li><a href="link">sub-sub-sub-item4</a>
</li>
</ul>
</div>
</li>
<li><a href="link">sub-sub-item2</a>
</li>
<li><a href="link">sub-sub-item3</a>
</li>
</ul>
</div>
</li>
<li>
<a href="" class="link">sub-item2</a>
</li>
</ul>
</div>
</li>
</ul>
</nav>
究竟你在看的? – Geeky
如果你想在menuitem中選擇li項目,只需使用.menu-item li:nth-child(奇數){ color:red; } .menu-item li:n-child(偶數){ color:green; } – Geeky
正如@Geeky所說,你不清楚你在問什麼。你要求偶數或奇數的交替,但在標記中你指出3種顏色。不應該是2種顏色? – vals