CSS自定義圖片大小的方法

在CSS中，我們可以使用width和height屬性來定義圖片的大小，這兩個屬性分別表示圖片的寬度和高度。

如果我們有一張圖片，想要將其寬度設(shè)置為200像素，高度設(shè)置為300像素，可以使用以下CSS代碼：

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

這段代碼會將所有img元素的寬度設(shè)置為200像素，高度設(shè)置為300像素。

如果我們只想改變某一張圖片的大小，可以給這張圖片添加一個類名，然后在CSS中針對這個類名進行樣式設(shè)置：

<img class="my-image" src="image.jpg" />

.my-image {
  width: 200px;
  height: 300px;
}

這樣，只有這張帶有my-image類名的圖片才會被改變大小。

需要注意的是，如果圖片本身的寬高比與設(shè)置的寬高比不一致，圖片可能會出現(xiàn)拉伸或壓縮的變形，為了避免這種情況，可以設(shè)置object-fit屬性為contain或cover：

.my-image {
  width: 200px;
  height: 300px;
  object-fit: contain;
}

這樣，圖片會被縮放并裁剪以適應新的尺寸，同時保持其原始的寬高比。