老师 为什么我写出来logo会高三个像素啊
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>慕课网</title>
<link rel="stylesheet" type="text/css" href="./css/main.css">
</head>
<body>
<div id="top">
<div class="content">
<span><img src="./img/arrow.jpg"></span>
<span>设为首页</span>
<span><img src="./img/arrow.jpg"></span>
<span>加入收藏</span>
<span><img src="./img/arrow.jpg"></span>
<span>联系我们</span>
</div>
</div><!--top结束-->
<div id="wrap">
<div class="icon">
<div class="logo">
<img src="./img/logo.jpg">
</div>
<div class="tel">
<img src="./img/tel.jpg">
24小时服务热线：
<span class="number">
123-456-7890
</span>
</div>
</div><!--icon over-->
<div class="nav">
<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>
</ul>
</div>
</div>
CSS代码如下
@charset "UTF-8";
* {
margin: 0;
padding:0;
font-size: 12px;
}
body {
background-color: #f5f5f5;
}
#top {
width: 100%;
height: 27px;
background: url(../img/top_bg.jpg) repeat-x;
}
#top .content {
float: right;
width: 35%;
line-height: 27px;
color: #8e8e8e;
}
.content span {
font-size: 10px;
}
#wrap {
width: 1000px;
margin:0 auto;
}
.icon {
background-color: #FFF;
height: 83px;
}
.icon .logo {
width: 375px;
float: left;
display: inline;
background-color: #aed;
}
.icon .tel
{
width: 300px;
height: 28px;
margin-top: 30px;
float: right;
display: inline;
color: #8E8E8E;
}
.icon .tel img {
vertical-align: middle;
margin-right: 10px;
}
.icon .tel .number {
color: #c00;
font-size: 22px;
font-family: '微软雅黑';
}
#wrap .nav {
background-color: #000;
height: 28px;
}
.nav ul li {
color: #fff;
float: left;
}
把logo也设置一个高度为80px就可以消除这个问题 但是我想不出来为什么
麻烦你帮我看一下，谢谢了
