哪位大神帮我看看,头部感觉没垂直居中,可是我加line-height了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
* {
margin:0;
padding:0;
}
nav{
background-color:#999;
height:40px;
}
nav ul{
list-style:none;
}
nav ul li{
height:40px;
line-height:40px;
text-align:center;
float:right;
display:inline-block;
}
nav ul .logo{
float:left;
}
nav ul li a{
text-decoration:none;
margin:10px;
display:inline-block;
}
.banner{
height:500px;
background-color:#666;
}
.banner .inner{
max-width:250px;
margin:0 auto;
position:relative;
top:160px;
text-align:center;
}
.banner .inner button{
border:none;
color:#CCC;
background-color:#333;
padding:10px 20px;
font-size:16px;
}
.banner .inner p{
margin:10px auto;
line-height:25px;
}
.banner .inner .more{
margin-top:80px;
}
</style>
</head>
<body>
<header>
<nav>
<ul>
<li class="logo"><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>
</nav>
<div class="banner">
<div class="inner">
<h1>王小白</h1>
<p>这是一个神奇的地方,在这里你将得到魔法,很神奇吧,快加入我们吧!</p>
<button>了解我</button>
<div class="more">更多</div>
</div>
</div>
</header><!--页眉-->
<div class="content"></div><!--内容-->
<footer></footer><!--页脚-->
</body>
</html>