Есть список категорий, вложенность которого может достигать до 10 категорий
Возможно ли с помощью css скрыть последний ul внутри первого ul
.test:last-child ul {
display: none;
}
<ul class="test">
<li>
<a href="/" class="nav-link">1 категория</a>
<div class="pluse">+</div>
<ul>
<li>
<a href="/" class="nav-link">Подкатегория</a>
<div class="pluse">+</div>
<ul>
<li>
<a href="/" class="nav-link">Под категория под категории</a>
<div class="pluse">+</div>
</li>
</ul>
</li>
</ul>
</li>
</ul>
Пробовал для главного ul задавать класс test и через псевдокласс :last-child скрывать, но скрывается все меню.
Он скрывает вторую вложенность, возможно ли найти последний ul элемент внутри 'ul.test'?
Укажите последнему тегу li класс "hide" CSS
.hide{
display:none;
}
укажите класс class="hide"
<ul>
<li>
<a href="/" class="nav-link">1 категория</a>
<div class="pluse">+</div>
<ul>
<li>
<a href="/" class="nav-link">Подкатегория</a>
<div class="pluse">+</div>
<ul>
<li class="hide">
<a href="/" class="nav-link">Под категория под категории</a>
<div class="pluse">+</div>
</li>
</ul>
</li>
</ul>
</li>
</ul>
Если вы указываете корневому ul некий класс, то необходимо через javascript искать последний li для скрытия.
Возможно не совсем то что Вы имели в виду.. Но всё же..
ul:last-child ul {
display: none;
}
<ul class="test">
<li>
<a href="/" class="nav-link">1 категория</a>
<div class="pluse">+</div>
<ul>
<li>
<a href="/" class="nav-link">Подкатегория</a>
<div class="pluse">+</div>
<ul>
<li>
<a href="/" class="nav-link">Под категория под категории</a>
<div class="pluse">+</div>
<ul>
<li>
<a href="/" class="nav-link">Под категория под категории</a>
<div class="pluse">+</div>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости