纯CSS实现下拉菜单

04月/07日/CSS教程/浏览 195

之前,实现下拉菜单,总是使用js监听mouseover、mouseout事件。


这两天复习css,发现使用css实现下拉菜单,更简单,更方便。到现在才发现,真是尴尬啊……


这个功能的关键点,其实就是鼠标移入父菜单项时,显示子菜单列表;鼠标移出父菜单项时,隐藏子菜单列表。


使用下面的代码即可:

.children-menu {
    display: none;
}

.parent-menu-item:hover .children-menu {
    display: block;
}


css

发表评论

暂无评论,抢个沙发...

客服 工单