在設定圖片邊框樣式中，圖片或者表單等行內元素，這樣會造成一個問題，就是圖片底側以及圖片與圖片之間會有一個空白縫隙。原因是行內元素之間的回車符系統預設為一個空格，佔據了一定寬度。

解決的方法就是：

1. 給img 新增vertical-align:middle | top等等。 讓圖片不要和基線對齊。（只能修改圖片底部的間隙）

img{
			/*vertical-align: bottom;*/
			vertical-align: top;
		}

2.給img的父元素設定與img相同的固定高度（只能修改圖片底部的間隙）

div{
            border: 1px solid red;
            height:280px ;
        }
 

3.給img 新增 display：block; 轉換為塊級元素就不會存在問題了，水平方向設定浮動。

 img{
        display: block;
        float: left;
    }

4.給img的父元素設定字型大小為0px，若父元素還有其他字型元素，再單獨設定字型大小覆蓋。（推薦使用）

div{
            border: 1px solid red;
            font-size: 0;
        }