CSS圖片怎么變比例？ 在設計網頁時，經常需要使用圖片來豐富頁面內容，但有時候圖片的比例不符合我們的要求，該怎么辦呢？這時候，我們可以使用CSS來改變圖片的比例。 CSS中有兩個屬性：width和height，它們可以分別設置圖片的寬度和高度。但是，如果只設置其中一個屬性，圖片的比例就會失衡。所以我們可以使用“aspect-ratio”屬性來設置圖片的寬高比例。該屬性可以使用“width”和“height”屬性來計算出一個可讀寬高比，并將其應用于元素。 以下是一個使用CSS改變圖片比例的例子：

HTML 代碼：
CSS 代碼：
img{
aspect-ratio: 3/2;  
}

在這個例子中，我們使用了一個寬度為300像素、高度為200像素的圖片。然后，我們使用CSS設置了這個圖片的寬高比例為3:2，即每個寬度單位的圖片高度為2/3。 除了使用“aspect-ratio”屬性之外，我們還可以使用“max-width”和“max-height”屬性來限制圖片的最大寬度和最大高度，并保持圖片的比例。這些屬性的值可以是像素值、百分比，甚至是其他單位。 以下是一個使用“max-width”和“max-height”屬性來改變圖片尺寸的例子：

HTML 代碼：
CSS 代碼：
img{
max-width: 100%;
max-height: 200px;
}

在這個例子中，我們使用了一個寬度為600像素、高度為400像素的圖片。然后，我們使用CSS限制了這個圖片的最大寬度為100%和最大高度為200像素，并保持圖片的比例。因為設置了最大寬度為100%，所以圖片的寬度會根據其父元素的寬度而自動調整。 總之，使用CSS可以輕松地改變圖片的比例和尺寸，使其更符合我們的設計需求。