CSS圖片上方留白是一個很常見的問題。如果你添加了一張圖片到一個HTML頁面中，你可能會發(fā)現(xiàn)圖片上方留有一段空白。這篇文章將介紹如何用CSS解決圖片上方留白的問題。

img {
display: block;
margin: 0 auto;
padding: 0;
}

代碼中的這個CSS樣式會將圖片設(shè)置成一個塊級元素（display:block），并且會將圖片的外邊距（margin）設(shè)置成0，并將內(nèi)邊距（padding）也設(shè)置成0。這樣的話，圖片上方的留白就會被去掉。

如果這段代碼不能解決你的問題，你還可以嘗試一些其他的方法。比如，在圖片最外層包裹一個div，將div的高度設(shè)置成圖片的高度，然后將圖片絕對定位到div中間。這樣也可以解決圖片上方留白的問題。

.container {
height: 300px;
position: relative;
 }
.container img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
 }

上面的代碼中，我們將.container高度設(shè)置成圖片的高度，然后將圖片絕對定位到.container中間。我們使用translate屬性將圖片從中心偏移回來。這樣，我們就可以解決圖片上方留白的問題。

如果你在使用CSS時遇到一些問題，你可以嘗試一些不同的方法。有時候，解決問題的方法并不是唯一的。