作业中鼠标点击家电，会显示对应的无序列表
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>display属性</title>
<style type="text/css">
div {
width: 200px;
}
h2{display:inline}
ul li {display:none;}
div:hover ul li{display:inline;}
/*补充样式*/
</style>
</head>
<body>
<div>
<h2><a href="#">家电</a></h2>
<ul>
<li>冰箱</li>
<li>空调</li>
<li>洗衣机</li>
</ul>
</div>
</body>
</html>
你好，老师，我想咨询一下，作业中要求是鼠标移动至家电字体处，才会显示无序列表ul元素内容，上述代码是否合理？我一开始尝试h2:hover ul li{display:inline},无法实现鼠标移动至家电处，将隐藏的ul属性内容显示
:hover的使用要求是否为，:hover前面为父类，后面为其父类的子类？将代码更改为div:hover ul li{display:inline},但是鼠标并不需要悬停在家电标题上，在家电标题附近就可以将隐藏的内容显示出来（鼠标悬停到div容器内部，就可以触发hover属性么）？老师，代码是否有改进的空间呢？如何改进
正在回答
同学你好，.ec:hover span {display: block}写法是正确的，但是由于ec下只有span元素，如果默认将span元素隐藏了，div中没有任何内容，那么在页面中是无法显示div的，导致鼠标无法移入div，所以没法实现效果。可以给div设置个宽高背景颜色再测试下。
如果还有问题，可以将你写的完整代码直接粘贴过来，便于帮助同学准确的定位与解决问题，祝学习愉快~
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星