样式有问题，老师帮忙看看是哪不对

来源：2-10 作业题

慕慕026205

2019-05-11 20:23:38

*{
	padding:0;
	margin: 0;
	font-family:"微软雅黑"
}
.header{
	background-color:#07cbc9;
	width:100%;
	height:80px;
}
.header img{
	margin-left: 100px;
	margin-top:16px; 
	float: left;


}
.header .nav{
	float: right;

	padding-right: 40px;

	
}
.header .nav ul li{
	float: left;
	list-style: none;
	width: 70px;
	height: 80px;
	line-height: 80px;
	font-size: 5px;
	font-weight: bolder;
	color:#FFFFFF;
	text-align: center;
	

}
.logo a,.nav a{
	text-decoration:none; 

}/*去除下划线*/
/*导航颜色*/
.nav a:link{color:#FFFFFF;}
.nav a:hover{color:blue; }

.main .banner{
	width: 100%;
	height:800px;

}
.banner img{
	width: 100%;
	height:800px;
	position: relative;
}
.main .topplayer{
	position: absolute;
	z-index: 2;
	top:80px;
	left: 0;
	background-color:#000;
	width: 100%;
	height: 800px;
	opacity: 0.5;	
}
.main .topplayer-a{
	position: absolute;
	z-index: 3;
	width: 510px;
	height: 400px;
	top:480px;
	margin-top: -200px;
	right: 50%;
	margin-right: -255px;
	
	
}
/*边框各项值*/
.main .topplayer-a textarea,.main .topplayer-a input,.main .topplayer-a button{
	margin-bottom: 30px;
	opacity:0.5;
	background:none;
	color: white;
	border: 2px solid #FFFFFF;
	
}
/*边框颜色 滑动*/
.main .topplayer-a textarea:hover,.main .topplayer-a input:hover{
		border-color:#07cbc9; 
}
.main .topplayer-a button:hover{
		border-style:none;
		background-color:#07cbc9; 

}



.main .topplayer-a input{
	width: 505px;
	height: 39px;
	
}
.main .topplayer-a textarea{
	width: 505px;
	height:115px; 
	
}
.main .topplayer-a button{
	width: 123px;
	height: 39px;
	margin-left: 191px;
}

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>css网页布局</title>
	<link rel="stylesheet" type="text/css" href="css/index.css">
	</head>
<body>
	<!--头部 -->
	<div class="header">
		<div class="logo"><a href="#">
			<img src="images/logo.png">
		</div>
		<div class="nav">
			<ul>
				<li><a href="#">CONTACT</li>
				<li><a href="#">EVENTS</li>
				<li><a href="#">FACULTY</li>
				<li><a href="#">GALLERY</li>
				<li><a href="#">ABOUT</li>
				<li><a href="#">HOME</li>
			</ul>
		</div>
	</div>
	<!--主体-->
	<div class="main">
		<!--banner图-->
		<div class="banner">
			<img src="images/banner3.jpg">
			<!--遮罩层-->
			<div class="topplayer"></div>
			<div class="topplayer-a">
				<form>
				<P><input type="text" name="yonghuming" placeholder="your Name" /></P>
				<P><input type="text" name="dianhua" placeholder="your Phone" /></P>
				<P><input type="text" name="dianhua" placeholder="your Email" /></P>
				<P><textarea placeholder="Write Your Commit Here" /></textarea></P>
				<button>SENDMESSAGE</button>
				</form>
			</div>
		</div>
	</div>
	<!--about-->	
	<div class="about">
		<div class="about-top">
			<h2>ABOUT</h2>
			<P>FDKFJKDFJDIFEJFEJFIDFJLDJFLDFIIRJFKJKDLKFJSKJDFSKDFUIOKRGJIFGUIORGKFJGFIGRJGKFJGKFJGKFJ</P>

		</div>

		<div class="about-bottom"></div>





	 </div>	
	<!--底部-->
	<div class="footer">

	</div>
	


</body>
</html>