CSS中經常會用到圖片,而在圖片排列的時候,我們可能會發現圖片之間有一些不必要的空隙。這個問題該如何解決呢?
img { display: block; float: left; margin-right: -4px; }
可以在img標簽的樣式中加上上面的代碼,這樣可以消除圖片之間的空隙。其中,margin-right的值取決于你的圖片寬度和邊框寬度的大小。如果你的圖片有邊框,則需要加上邊框寬度,否則就不需要。
需要注意的是,如果你的圖片寬度不一致,這個方法可能會導致圖片錯位。針對這種情況,可以加上clear屬性。
.clear { clear: both; }
然后在圖片后面添加一段空標簽即可。
這樣就可以保證圖片不會錯位了。