如果img在div中，会发现图片并没有完全填充div，而是在下方出现了一点空隙
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.wrap{
background:lightblue;
}
.img{
height: 400px;
}
</style>
</head>
<body>
<div class="wrap">
<img class="img" src="1.jpg">
</div>
</body>
</html>
解决方案
- img设置display:block;
.img{
height: 400px;
display: block;
}
- div设置font-size:0;
.wrap{
background:lightblue;
font-size: 0;
}
效果
