CSS圖片如何設置大小 在網頁設計中，圖片是不可或缺的元素。然而，有時候我們需要調整圖片的大小以適應不同的布局和設備。這時候，就需要使用CSS來設置圖片的大小了。 設置圖片大小的方法有多種，下面分別介紹幾種常用的方法。 1. 使用width和height屬性 可以使用width和height屬性來設置圖片的寬度和高度。例如：

img {
width: 200px;
height: 150px;
}

以上代碼將會把圖片的寬度設置為200像素，高度設置為150像素。 需注意的是，直接使用width和height屬性會導致圖片變形。如果想要保持圖片的比例，可以只設置其中一個屬性，另一個屬性會自動按比例縮放。 2. 使用max-width和max-height屬性 max-width和max-height屬性可以設置圖片的最大寬度和最大高度，當圖片實際大小超過這個限制時，會自動按比例縮小。例如：

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

以上代碼將會把圖片的最大寬度和最大高度都設置為可用空間的100%。這個方法在響應式設計中非常有用，可以根據屏幕大小自動調整圖片大小，保證在不同設備上都能正確顯示。 3. 使用object-fit屬性 object-fit屬性用于控制圖片的適應方式。默認情況下，圖片會保持原有的比例并盡可能大地填充父元素的空間。如果想要調整圖片的適應方式，可以使用object-fit屬性。例如：

img {
object-fit: cover;
}

以上代碼將會把圖片縮放到能夠完全覆蓋父元素，超出部分會被裁剪掉。 4. 使用background-image屬性 background-image屬性可以把圖片作為背景設置給元素。這個方法常用于需要平鋪或者需要控制圖片位置的情況。例如：

div {
background-image: url("example.jpg");
background-size: cover;
}

以上代碼會把example.jpg圖片設置為div元素的背景，并自適應地縮放以完全填充div元素。 總結 以上介紹了一些常用的設置圖片大小的方法。需要根據具體的布局和需求選擇適當的方法，以達到最佳的視覺效果。