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>

图片描述

阅读 10.3k
5 个回答

很老的问题了。

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

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

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

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

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

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏