我的CSS下拉式菜单显示不起(能麻烦告诉我错在哪了吗?)

html-css018

我的CSS下拉式菜单显示不起(能麻烦告诉我错在哪了吗?),第1张

你的最后一个样式写的有问题

.dpdct:hover .dropdown-content {

    display: block

}

这样写是鼠标悬浮后它的子元素显示

在两个选择器之间放个+是鼠标悬浮后它的下一个兄弟元素显示

.dpdct:hover+.dropdown-content {

display: block

}

不过这样改完,鼠标悬停确实能显示下拉选项,但是只要鼠标移开主菜单下拉选项就会消失。建议你改成

.head_section:hover .dropdown-content {

    display: block

}

这样应该才是你需要的效果

可以参考CSS 选择器参考手册

希望能帮到你

*{ margin:0px autopadding:0px}

.nav{ width:930pxmargin:0px auto}

ul{ list-style:none}

ul li{ float:leftwidth:100px}

ul li ul{ display:none}

ul li:hover ul{ display:block}

这样在支持LI:HOVER的浏览器下是可以的。。不支持的浏览器通过JS解决