hover
а в мобильной версии по click
и выдумал такое <menu class="desctop">
<ul>
......
</ul>
</menu>
<menu class="mobile">
<ul>
......
</ul>
</menu>
@media screen and (max-width:....) {
.desctop{
display:none;
}
.mobile{
display:block; /*по ситуации*/
}
}
<menu>
и вложенный в него<ul>
, уже не особо корректно.ul > li
либо menu > li
.