我在使用CSS翻转菜单时遇到了一些麻烦.
我已经看过很多,并且有教程,但是有太多不必要的代码,我发现很难区分哪些是所需的代码,哪些只是其他CSS.
我想在CSS上有一个悬停菜单,因为我正在处理的网站有很多用户故意禁用脚本(JavaScript).
我不明白,在CSS中,当用户将鼠标悬停在父列表项上时,如何使“子菜单”显示在其父列表项下面.有人可以帮我理解这在CSS中是如何工作的吗？
下面是我所指的图片：
解决方法
以下将以其基本形式工作,但风格适合您自己的口味(位置,边框,颜色等)：
<ul>
<li>Simple List item
<ul>
<li>sub menu item 1</li>
<li>sub menu item 2</li>
<li>sub menu item 3</li>
</ul>
</li>
</ul>
使用CSS：
ul li {
position: relative;
}
ul ul {
position: absolute;
top: 1em;
left: 0;
display: none;
}
ul > li:hover ul {
display: block;
}
