用jquery实现的一个超级简单的下拉菜单。 效果图 初始效果 鼠标悬浮效果 代码 nav a { text-decoration: none; } nav > ul > li { float: left; text-align: center; padding: 0 0.5em; } nav li ul.sub-menu { display: none; padding-left: 0 !important; } .sub-menu li { color: white; } .sub-menu li:hover { background-color: black; } .sub-menu li:hover a { color: white; } ul { list-style: none; } Home sub1 sub2 sub3 Programming sub1 sub2 sub3 Japanese sub1 sub2 sub3 $(document).ready(function() { $('nav li').hover(function() { $(this).find('.sub-menu').css('display', 'block'); }, function() { $(this).find('.sub-menu').css('display', 'none'); }); }); ログイン後にコピー 更多用jquery实现的一个超级简单的下拉菜单相关文章请关注PHP中文网！
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
