div之间会有空隙？怎么消除？

代码如下，box没有样式，为什么两个图片之间会有间隙（如下图），我查了下没有任何padding，margin，border等。还有，怎样去掉间隙？

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>Water Fall</title>
</head>
<body>
    <div class="box"><img src="./img/0.jpg" alt=""></div>
    <div class="box"><img src="./img/0.jpg" alt=""></div>
</body>
</html>

很老的问题了。

你可以给img的css设置display: block; 或者 vertical-align: middle; 来去除这多余的 3px 空白。

或者手动指定外面的 div 高度也可以。

img{display:block}

这是图片的间隙，不是div的，可以级图片设置 display:block | inline-block; vertical-align:top;

给第二个img的margin-top设个负值，应该可以解决这个问题吧

img {display:block;}或者img {vertical-align:top;}

【热门文章】