CSS中讓圖片自適應(yīng)div大小的方法

在CSS中，我們可以使用object-fit屬性來實現(xiàn)圖片的自適應(yīng)大小，Object-fit屬性可以指定圖片在容器中如何適應(yīng)其大小，

div {
  width: 300px;
  height: 200px;
}
img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

在這個例子中，圖片會適應(yīng)div的寬度和高度，同時保持其原始的長寬比，Object-fit屬性的其他值還包括contain，它會保證圖片在容器內(nèi)完全可見，但可能會留下空白。

我們還可以使用max-width和max-height屬性來限制圖片的***大尺寸，

img {
  max-width: 100%;
  max-height: 100%;
}

這樣，圖片就不會超過div的寬度和高度，同時保持其原始的長寬比，這種方法在處理響應(yīng)式布局時非常有用，可以確保圖片在各種設(shè)備上都能正常顯示。

CSS提供了多種方法來讓圖片自適應(yīng)div的大小，我們可以根據(jù)具體的需求選擇***適合的方法。