在網(wǎng)頁開發(fā)中，經(jīng)常需要對(duì)圖像進(jìn)行縮放以適應(yīng)不同的屏幕尺寸。同時(shí)，為了保持圖像的比例不變，我們也需要按比例縮放圖像。CSS提供了多種方式來實(shí)現(xiàn)圖像按比例縮放。

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

上述代碼的作用是將圖像的最大寬度設(shè)置為100%，同時(shí)保持圖像的高度自適應(yīng)，即按比例縮放。

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

這段代碼將圖像的寬度設(shè)置為50%，同時(shí)保持高度自適應(yīng)，也實(shí)現(xiàn)了按比例縮放。但是，如果圖像的寬高比不是1:1，那么縮放后會(huì)失去原有的比例。

div {
width: 50%;
height: 0;
padding-bottom: 50%;
background-image: url(image.jpg);
background-size: cover;
}

這段代碼將一個(gè)div元素的寬度設(shè)置為50%，同時(shí)設(shè)置padding-bottom為50%。這樣，div元素的高度就是寬度的50%，保證了寬高比例。接著，使用background-image將圖像作為div元素的背景，并設(shè)置background-size為cover，可以讓圖像完整地覆蓋div元素。

綜上所述，我們可以使用上述任意一種方式來實(shí)現(xiàn)圖像的按比例縮放，具體根據(jù)需求來選擇合適的方法。