将鼠标悬停在单个菜单项上时，如何显示整个菜单

Question

每当我将鼠标悬停在其中一个菜单项上时，我都会尝试使整个菜单包括每个菜单项的子菜单项。这是一种在韩国很流行的菜单设计，但我在网上找不到关于如何做到这一点的解释。有人能就如何做到这件事提供一些建议或建议吗？非常感谢。

这是使用我提到的设计的网站之一：https://www.saga121.com/

Answer 1

一个示例。将鼠标悬停在列表2上，显示子菜单。

li{
float:left;
list-style:none;
width: 30px;
margin: 10px;
text-align: center;
}
.ul2{
display:none;
}
.li2{
cursor: pointer;
}
.li2:hover .ul2{
display:block;
}

<ul class="ul1">
<li>1</li>
<li class="li2">2
<ul class="ul2">
<li>3</li>
<li class="li4">4</li>
</ul>
</li>
</ul>