在網(wǎng)頁(yè)設(shè)計(jì)中，經(jīng)常需要用到圖片，并有時(shí)需要對(duì)圖片進(jìn)行縮放。CSS的縮放圖片函數(shù)可以幫助我們實(shí)現(xiàn)這個(gè)功能。

CSS的縮放圖片函數(shù)有兩種：transform和background-size。

transform

img {
transform: scale(0.5); /* 縮小一半 */
}

上面的代碼可以將圖片縮小一半。想要放大圖片，只需要將0.5改為大于1的數(shù)字即可：

img {
transform: scale(1.5); /* 放大一半 */
}

background-size

div {
background-image: url(path/to/image.jpg);
background-size: 50%; /* 縮小一半 */
}

這里將縮放的屬性寫在了background-size里，其值為縮放的百分比。同樣地，想要放大圖片，只需要將50%改為大于100%的數(shù)字即可：

div {
background-image: url(path/to/image.jpg);
background-size: 150%; /* 放大一半 */
}

CSS縮放圖片函數(shù)的應(yīng)用十分廣泛，通過靈活運(yùn)用可以大大豐富網(wǎng)頁(yè)的視覺風(fēng)格。