在網頁設計中，經常需要使用圖片作為頁面的裝飾或者背景。有時候，我們需要調整圖片的大小比例來適應頁面，這時候就需要使用CSS圖片比例縮放的技巧了。 CSS提供了一種簡單的方法來執行圖片比例縮放。通過設置圖片的寬度和高度，我們可以控制圖片的大小和比例。 下面是一個常見的CSS代碼示例，可以定義一個圖片的大小和比例：

img {
width: 50%;
height: auto;
}

在這個示例中，我們使用了兩個屬性來定義圖片的大小。首先，我們設置圖片的寬度為50%。這就意味著，圖片會占據其父元素寬度的一半。其次，我們設置圖片的高度為自適應，使用“auto”關鍵字。這樣，圖片的高度會根據其寬度自動調整，以保持其比例。 如果我們想要更改圖片的比例，可以修改寬高比。例如，如果我們想將圖片的高度設置為其寬度的一半，可以使用以下CSS代碼：

img {
width: 50%;
height: 25%;
}

在這個示例中，我們將圖片的高度設置為其寬度的25％，從而實現了一種更小的比例。此時，圖片的高度會始終是其寬度的四分之一。 總結一下，使用CSS圖片比例縮放是一個簡單而有用的技巧，可以使您的網頁設計更具吸引力和易于使用。記住，您可以通過設置寬度和高度來控制圖片的大小和比例，從而實現您想要的效果。