CSS圖片高度如何占滿div

在CSS中，圖片高度占滿div的方法有很多，主要取決于你的具體需求，以下是一些常見的解決方案：

1、設(shè)置圖片高度為100%：

如果你想要圖片高度占滿整個div，你可以嘗試將圖片的高度設(shè)置為100%，這可以通過在CSS樣式表中添加以下代碼來實(shí)現(xiàn)：

img {
  height: 100%;
}

2、使用object-fit屬性：

另一個方法是使用object-fit屬性，該屬性可以指定圖片在容器中的填充方式，你可以將圖片設(shè)置為覆蓋整個容器，而不考慮其原始寬高比：

img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

3、使用flexbox布局：

如果你想要更靈活地控制圖片和其他元素在容器中的布局，你可以嘗試使用flexbox布局，通過將容器設(shè)置為flexbox，你可以輕松地調(diào)整圖片和其他元素的大小和位置：

div {
  display: flex;
  height: 100%;
}
img {
  flex: 1;
  height: 100%;
}

是一些常見的解決方案，你可以根據(jù)自己的需求選擇適合的方法，這些方法可能因瀏覽器和版本的不同而有所差異，因此請確保在多種瀏覽器中進(jìn)行測試以確保兼容性。