插入图片img的问题
当我们在html中通过img标签插入一张图片的时候,我们会发现图片和父盒子的地步有一个白色的空隙,我们如何解决呢?
- 我们可以把img转换成块级元素,就可以消除缝隙
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>img</title>
<style>
*{
margin: 0;
padding: 0;
}
.box{
width: 500px;
border: 1px solid red;
margin: auto;
}
img{
display: block;/*在img的身上加一个display:block就把图片的下面的多余的空隙就去除了*/
}
</style>
</head>
<body>
<div class="box">
<img src="images/1.jpg" alt="">
</div>
</body>
</html>
复制代码