Tenho um menu com até 3 níveis de listas aninhadas. Preciso selecionar apenas o texto do primeiro nível e ignorar o conteúdo aninhado. Tentei usar .menu > ul> li {}
(e algumas variações disto) e não resultou no que precisava.
Tentei usar .menu li:first-child > ul
e resultou no oposto do que eu preciso, ou seja, trouxe tudo menos o primeiro nível. Tentei usar o pseudo-seletor :not
na condição acima, mas não consegui.
Então preciso de ajuda com este seletor. Como fazer?
<div class="menu">
<ul>
<li>Item nível 1
<ul>
<li>Item nível 2
<ul>
<li>Item nível 3</li>
<li>Item nível 3</li>
<li>Item nível 3</li>
</ul>
</li>
<li>Item nível 2</li>
<li>Item nível 2</li>
</ul>
</li>
<li>Item nível 1
<ul>
<li>Item nível 2</li>
<li>Item nível 2</li>
<li>Item nível 2</li>
</ul>
</li>
</ul>
</div>