div中放一个图片,往往div的下边缘会多出来几px的边距.
<!doctype html>
<html>
<head>
<title></title>
<style type="text/css">
div{
background: black;
}
</style>
</head>
<body>
<div>
<img src="1.jpg">
</div>
</body>
</html>
处理方法1
给div设置一个和图片一样的高度.(让div的高度等于图片的高度)
<!doctype html>
<html>
<head>
<title></title>
<style type="text/css">
div{
background: black;
height: 525px;//设置一个高度
}
</style>
</head>
<body>
<div>
<img src="1.jpg">
</div>
</body>
</html>
方法2
给图片来一个display:block;让其变为块标签.
<!doctype html>
<html>
<head>
<title></title>
<style type="text/css">
div{
background: black;
}
img{
display: block;//把图片变为块表签
}
</style>
</head>
<body>
<div>
<img src="1.jpg">
</div>
</body>
</html>