在網頁設計中，經常會使用圖片來增強頁面的效果和視覺效果。然而，有時候我們可能會發現在使用圖片時，圖片底部會留有一段空白。這個空白可能會使得頁面的布局不美觀，影響用戶的視覺感受。那么，這種問題該如何解決呢？

img{
display:block;
}

解決方法其實很簡單，只需要給圖片添加一個CSS屬性即可。我們可以在CSS樣式表中使用“display:block;”來解決這個問題。這個屬性可以將圖片的顯示方式從默認的“inline”變成“block”，這樣底下的空白也就消失了。

同時，我們也可以在HTML代碼中給圖片添加一個類名，然后再通過CSS樣式表對這個類名進行設置。

img.my-image{
display:block;
}

在代碼中，我們給圖片添加了一個類名“my-image”，然后在CSS樣式表中對這個類名進行了設置，代碼與之前的例子類似，也是使用了“display:block;”

總的來說，解決css圖片底下留白的問題并不復雜，只需要添加一個CSS屬性或者給圖片添加一個類名即可。但是需要注意的是，在實際使用中，不同圖片可能會有不同的影響，我們需要結合具體情況做出適當的調整，才能使得頁面最終達到理想的效果。