CSS按比例縮小圖片的方法

在CSS中，我們可以使用width和height屬性來(lái)按比例縮小圖片，以下是一個(gè)簡(jiǎn)單的例子：

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

在這個(gè)例子中，我們將圖片的寬度和高度都縮小了50%，這意味著圖片的大小將變?yōu)樵即笮〉?0%。

如果你想將圖片縮小到特定的寬度和高度，你可以直接使用像素值來(lái)替代百分比。

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

在這個(gè)例子中，圖片將被縮小到寬度為300像素、高度為200像素的大小。

使用CSS按比例縮小圖片時(shí)，圖片的寬高比將保持不變，因此圖片不會(huì)變形，如果你希望改變圖片的寬高比，可以使用object-fit屬性來(lái)實(shí)現(xiàn)。

img {
    width: 300px;
    height: 200px;
    object-fit: cover;
}

在這個(gè)例子中，圖片將被縮小到寬度為300像素、高度為200像素的大小，并且使用cover值來(lái)保持圖片的寬高比不變。