サマリー：<!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這種方法不可取，代碼冗余了 ，你可以試著無序列表嵌套達到下拉菜單顯示效果；不是移上沒效果，是你的布局問題