Question

css二级菜单对齐问题

这里是一个菜单，当鼠标移动上去之后，二级菜单会自动显示（如图），但是它现在是跟上面菜单是对齐的，我想要的是不要与上面的菜单对齐，让它从屏幕的最左边开始显示，或者以“栏目一”的左边对齐也可以，求解决方法

Answer 1

二级栏目单独放在一个div中，然后定位到相应的位置即可。

追问

那我用li:hover怎么控制到下面的div呢，样式怎么写？
li:hover menu{display:block;}
我这样写为什么控制不到呢，下面div的样式名是menu，怎样才能控制到下面的div呢？

追答

首先menu定位之后，你需要用z-index属性设置元素的堆叠顺序；然后使用tab切换，从而实现相应二级栏目的显示。

追问

不太明白，方便给个大概的代码吗

Answer 2

结构上子栏目菜单不要和它所属主栏目放在一个div里

追问

那我用li:hover怎么控制到下面的div呢，样式怎么写？
li:hover menu{display:block;}
我这样写为什么控制不到呢，下面div的样式名是menu，怎样才能控制到下面的div呢？

追答

一般用js做，tab选项卡形式