最近在進行CSS布局時,發現了一個問題:圖片之間會出現空隙。即使將圖片的margin和padding都設為0,空隙依然存在。
經過搜索和嘗試,發現這是由于HTML中圖片之間的空格導致的。類似于下面這樣:
<img src="1.jpg"> <img src="2.jpg">
上面的HTML代碼中,兩張圖片之間有一個空格。這個空格會被解釋成一個文字空格,從而導致圖片之間的間隔。
解決這個問題的方法也很簡單,只需要將圖片標簽寫在一起即可:
<img src="1.jpg"><img src="2.jpg">
或者使用注釋來消除空格:
<img src="1.jpg"><!-- --><img src="2.jpg">
這樣就可以完美消除圖片之間的空隙了。