CSS——24.实战技能网导航栏 hove状态
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>技能网导航hover状态</title>
<style type="text/css">
nav{width: 1000px;height: 40px;background:#363636;margin: 100px auto;}
nav div{width: 100px;height: 40px;line-height: 40px;float: left;color: #ffffff;text-align: center; font-size: 14px;}
nav div:hover{
font-size: 16px;
color: #00aeff;
}
</style>
</head>
<body>
<nav>
<div>电脑办公</div>
<div>平面设计</div>
<div>室内设计</div>
<div>室外设计</div>
<div>影视动画</div>
<div>机械设计</div>
<div>工业自动</div>
<div>程序设计</div>
<div>网页设计</div>
<div>会计课程</div>
</nav>
</body>
</html>
nav标签用于做导航栏很方便
后代选择器nav div{ }
nav div:hover{ }利用后代选择器添加 hover状态