摘要：<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>css演示</title> <style type="text/css"> body { margin:0; padding: 0; } li
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css演示</title>
<style type="text/css">
body
{
margin:0;
padding: 0;
}
li {
list-style: none;
float: left;
width: 200px; height: 40px;
line-height: 40px;
margin-left: 5px; background-color: #ccc;
text-align: center;
}
.menumain1
{
list-style: none;
float: left;
width: 200px; height: 40px;
line-height: 40px;
margin-left: 5px; background-color: #ccc;
text-align: center;
}
.menumain1:hover .menus1 {
display: block;
}
.cls
{
clear: both;
}
.menus1
{
width: 50px; background-color: #faf4ff;
display: none;
}
</style>
</head>
<ul>
<li class="menumain1">文件
<div class="menus1">new</div>
<div class="menus1">open</div>
<div class="menus1">del</div>
<div class="menus1">quit</div>
</li>
<li class="menumain1">Tools
<div class="menus1">cut</div>
<div class="menus1">del</div>
<div class="menus1">replace</div>
<div class="menus1">quit</div>
</li>
<li class="menumain1">Options
<div class="menus1">evn</div>
<div class="menus1">para</div>
</li>
<li class="menumain1">help
<div class="menus1">help</div>
<div class="menus1">about</div>
</li>
</ul>
为什么我的li 鼠标滑过无效 需要点击才生效
</body>
</html>
批改老师：灭绝师太批改时间：2018-12-12 17:33:20
老师总结：你的布局还是有点逻辑问题，给每个div一个相同class这种方法不可取，代码冗余了 ，你可以试着无序列表嵌套达到下拉菜单显示效果；不是移上没效果，是你的布局问题
