问题1：鼠标指向导航栏li，但li中a样式未改变

<!--HTML代码-->
<div class="nav-mid-left">
	<ul>
		<li><a href="#">首页</a></li>
		<li><a href="#">关于慕课</a></li>
		<li><a href="#">新闻动态</a></li>
		<li><a href="#">课程中心</a></li>
		<li><a href="#">在线课程</a></li>
		<li><a href="#">人才招聘</a></li>
	</ul>
</div>

.nav-mid-left {
	width: 650px;
	float: left;
}
.nav-mid-left li {
list-style-type: none;
	float: left;
	width: 100px;
	text-align: center;
}
.nav-mid-left li:hover{
	background-color: #aaa;	
}
/*将a设为行内块级元素，并将其大小设置为父元素li的大小*/
.nav-mid-left a{
	display: inline-block;
	width: 100%;
	height: 100%;	
}
.nav-mid-left a:hover{
	color: red;
}