css菜单显示与不显示不出来,用hover显示子菜单，没反应，甚是不解！_html/css_WEB-ITnose...

|

XXXXXXXX

|

鼠标飘过显示子菜单

- xxxxxxxx -

- xxxxxxxx -

- xxxxxxxxx -

- xxxxxxxxxx -

|

XXXXXXXX

|

XXXXXXXX

|

XXXXXXXX

|

XXXXXXXX

|

XXXXXXXXX

|

XXXXXXXX

|

CSS:

#menu ul{margin:0 auto;position:absolute;/*background:#00FF00;*/list-style:none;padding:0px;height:26px;line-height:26px;}#menu ul li{float:left;padding:0px;height:26px;line-height:26px;}#menu ul li a {color:#7777CC;display:block;padding:0px 27px;height:26px;line-height:26px;float:left;text-decoration:none;}#menu ul li a:hover {background:#7777CC;color:#FFF;}#menu ul li a.rd:hover .submenu{visibility:visible;}#menu #submenu {position:absolute;padding:0px;float:left;top:26px;width:600px;height:54px;background-color:#7777CC;visibility:hidden;}/*如代码所示，a{display:none;} a:hover{display:block;}以及 a{visibility:hidden;} a:hover{visibility:visible;}都试过了，但是不知是选择的元素不对还是怎么样，没效果*/

求教！

回复讨论(解决方案)

表沉。。。

用js控制吧!

hover= mouseover / mouseout两个事件的合写

HTML code

|

XXXXXXXX

……

#menu ul li a:hover {

background:#7777CC;

color:#FFF;

}

你这是什么啊，这是对超链接的有作用，当鼠标放到超链接上面时，颜色，背景改变了

建议这样试试 a:hover div{display:block}

建议这样试试 a:hover div{display:block}

没用啊。。

用js控制吧!

hover= mouseover / mouseout两个事件的合写

我尽量不想用JS

引用楼主 的回复:

HTML code

|

XXXXXXXX

……

#menu ul li a:hover {

background:#7777CC;

color:#FFF;

……

不太明白您的意思，我这样写不会影响子菜单显示吧。

影响其显示的应该这个吧：#menu ul li a.rd:hover #submenu{ /*更正一下，发帖中把#submenu写成.submenu了*/ visibility:visible;}