空白產生原因：?圖片默認的vertical-align是baseline，（元素放置在父元素的基線上，也就是xx下邊距）

一個inline-block元素，如果里面沒有inline元素，或者overflow不是visible，則該元素的基線就是其margin底邊緣，否則，其基線就是元素里面最后一行內聯元素的基線。

所以我們只需要將img圖片display:block，即可去掉div和img之間的空白

或者將div的line-height設置得足夠小，也可以去掉空白，例如div{line-height:5px;}

也可以將font-size設為0，實際上也是改變了line-height

當然，我們可以改變vertical-align，讓它不是baseline，比如設置vertical-align:middle

?

轉載于:https://www.cnblogs.com/liuna/p/6678404.html

總結

以上是生活随笔為你收集整理的如何解决div里面img图片下方有空白的问题？的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。