那个（首页）为什么没有显示效果呢？？？？
<html>
<head>
<title>高度伸缩</title>
<style type="text/css">
* {margin:0px; padding:0px; list-style-type:none; font-size:14px; }
.nav {border-bottom:5px solid red;}
.nav ul{ height:30px; margin-top:30px; padding-left:30px;}
.nav ul li a{ width:120px; height:30px; line-height:30px; text-decoration:none;
background-color:#999; display:block; float:left; text-align:center;
}
.on,.nav ul li a:hover{ color:white; background-color:red; height:40px; margin-top:-10px;
line-height:40px;
}
</style>
</head>
<body>
<div class="nav">
<ul>
<li>
<a class="on" href="#">首页</a>
<a href="#">问题</a>
<a href="#">芝士蛋糕</a>
<a href="#">电信股份</a>
</li>
</ul>
</div>
</body>
</html>
这不是我想要的答案（这是得出来的结果！）
这才是我想要的答案！！！
小黄峰2回答
-
煎蛋的少年
nav ul li .on,.nav ul li a:hover{ color:white; background-color:red; height:40px; margin-top:-10px;line-height:40px;.on 改成 nav ul li .on 。难道说“ul”标签下，不能直接识别这个class=“on”?还是是优先值没有a标签高？我也不是很懂。 -
一杯2块的奶茶
你给.on写了margin-top:-10px;肯定会向上偏移10px
随时随地看视频慕课网APP
Html/CSS