Как скрыть и показать дочерний элемент ul и li с помощью CSS

---

<ul>
<li class="limain">A
<ul>
<li class="lichild">A1
<ul>
<li class="lichild">a1
<ul>
<li class="lichild">a11
<ul>
<li class="lichild"><a href="a222">a222</a>
</li></ul>
</li></ul>
</li><li class="lichild">a2</li></ul>
</li><li class="lichild">A2<ul>
<li class="lichild"><a href="a">a</a></li></ul>
</li></ul>
</li><li class="limain">B
<ul>
<li class="lichild">B1<ul>
<li class="lichild"><a href="b1">b1</a></li></ul>
</li></ul>
</li><li class="limain">C<ul><li class="lichild">C1
<ul>
<li class="lichild"><a href="c1">c1</a><ul>
<li class="lichild"><a href="c">c</a></li></ul></li></ul></li></ul></li><li class="limain">D<ul>
<li class="lichild">D1<ul><li class="lichild"><a href="d4">d4</a>
</li></ul>
</li><li class="lichild">D3</li></ul>
</li><li class="limain">E
<ul><li class="lichild">E1
<ul><li class="lichild"><a href="e">e</a></li></ul>
</li></ul>
</li><li class="limain">F
<ul>
<li class="lichild">F1
<ul>
<li class="lichild"><a href="f">f</a></li></ul>
</li></ul>
</li></ul>

Что я уже пробовал:

Я сделал css - код для отображения основного элемента, если я нажму основной элемент под всеми дочерними элементами, но в моем коде это не работает.


.limain
{
положение: относительное;

}

.lichild
{
дисплей: нет;
}

.limain а:Ховер + литий
{
дисплей: блок;

}

---