为什么上面有一块空白，在代码里面找又找不出来，如何修改才能把上面那行空白去掉？
<style>
* {
margin: 0;
padding: 0;
font-size: 16px;
font-family: "微软雅黑";
}
.nav {
height: 40px;
margin-top: 50px;
margin-left: 10px;
width: 1360px;
background-color: chartreuse;
}
.nav ul {
list-style: none;
}
/*设置的关键*/
.nav li {
float: left;
}
.nav li a {
text-decoration: none;
color: #000000;
display: block;
width: 200px;
height: 40px;
line-height: 40px;
text-align: center;
margin-right: 1px;
}
.nav li a:hover {
background-color: #FF6600;
color: #FFFFFF;
}
.logo {
background-color: cyan;
}
</style>
</head>
<body>
<div id="nav" class="nav">
<ul>
<li class="logo"><img src="" alt=""></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>
