在CSS中，我們可以通過(guò)一些簡(jiǎn)單的代碼實(shí)現(xiàn)讓圖片由大到小顯示的效果。

img{
transition: all 0.5s ease-in-out;
}
img:hover{
transform: scale(0.8);
}

代碼解釋?zhuān)?/p>

首先，我們給img標(biāo)簽添加了一個(gè)transition屬性，這個(gè)屬性的作用是讓過(guò)渡效果更加平滑。其中，all表示所有屬性都要過(guò)渡，0.5s表示過(guò)渡的時(shí)間長(zhǎng)度，ease-in-out表示過(guò)渡的速度曲線。這些屬性可以根據(jù)自己的需求來(lái)進(jìn)行修改。

接著，我們給img標(biāo)簽添加了一個(gè):hover偽類(lèi)，這個(gè)偽類(lèi)表示當(dāng)鼠標(biāo)懸停在圖片上時(shí)所要執(zhí)行的操作。在這里，我們使用了CSS3提供的transform屬性，將圖片的大小進(jìn)行了縮放。其中，scale(0.8)表示原始大小的80%。

通過(guò)這些簡(jiǎn)單的CSS代碼，我們可以輕松地實(shí)現(xiàn)讓圖片由大到小顯示的效果。