在網頁設計中，圖片大小的適配是非常重要的一項任務。如果圖片在不同屏幕上大小不一，就會影響用戶體驗。在CSS中，有很多方法可以適配圖片大小，下面我們來看看其中的一些方法。 使用max-width屬性 max-width屬性是CSS中常用的一種方法。它能夠控制元素的最大寬度，讓圖片適應不同屏幕大小。 下面是一個例子，我們使用了max-width屬性來設置圖片寬度不超過100%：

img {
max-width: 100%;
}

使用object-fit屬性 如果你想要適配圖片的高度，可以使用object-fit屬性。它能夠控制元素的大小和位置，讓圖片適應不同屏幕大小。 下面是一個例子，我們使用了object-fit屬性來設置圖片高度不超過100%：

img {
max-height: 100%;
object-fit: contain;
}

使用@media媒體查詢 如果你想要更加精確地適配圖片大小，可以使用@media媒體查詢。通過媒體查詢，我們可以根據不同的設備分辨率來設置圖片的大小。 下面是一個例子，我們使用@media媒體查詢來設置不同分辨率下圖片的大?。?pre>@media (max-width: 768px) { img { max-width: 50%; } } @media (min-width: 768px) and (max-width: 1024px) { img { max-width: 70%; } } @media (min-width: 1024px) { img { max-width: 100%; } }總結 以上就是三種常用的CSS適配圖片大小的方法。我們可以根據具體需求來選擇其中的一種或多種方法來使用。在設計中，合理使用適配圖片大小的方法，能夠為用戶提供更好的體驗。