как сделать при помощи СSS, что бы при наведении на блок с "подменю 1,подменю 2 и тп" "Меню 1" было выделено жирным шрифтом.
Пытался сделать с помощью такого CSS кода. Но вместе с "Меню 1" выделялись все подменю, а должно только Меню 1. Заранее благодарю за помощь. Спасибо
li:hover,
li:focus-within {
color: rgba(235,23,23,1);
color: rgb(0 0 0)!important;
-webkit-text-stroke: 1px #000;
-webkit-text-stroke-width: 1px;
-webkit-text-stroke-color: rgb(0, 0, 0);
}
HTML код самого меню.
<li id="5515074" data-id="5515074" class="md-menu__li-l1 menu-item js--menu__li-l1 with-sub">
<a class="md-menu__href-l1 js--menu-mobile-sildetoggle is--link-level1 f__menu big-height5"</a>
<div class="md-menu__wrap-l2" id="sub-5515074" data-parent-id="5515074" style="visibility: hidden; opacity: 0;">
<ul class="mod--submenu-center"><li class="md-menu__li-l2 " style="width: 255.996px;">
<a class="md-menu__href-l2 f__sub-menu"</a>
</li><li class="md-menu__li-l2 " style="width: 255.996px;"><a class="md-menu__href-l2 f__sub-menu"</a>
</li><li class="md-menu__li-l2 " style="width: 255.996px;"><a class="md-menu__href-l2 f__sub-menu"</a>
</li><li class="md-menu__li-l2 " style="width: 255.996px;"><a class="md-menu__href-l2 f__sub-menu"</a>
</li><li class="md-menu__li-l2 " style="width: 255.996px;"><a class="md-menu__href-l2 f__sub-menu"</a>
</li><li class="md-menu__li-l2 " style="width: 255.996px;"><a class="md-menu__href-l2 f__sub-menu"</a></li>
</ul>
</div>
</li>