CSS是前端開發(fā)中很重要的一環(huán)，可以通過它實(shí)現(xiàn)各種效果。今天我們來講一下如何通過CSS實(shí)現(xiàn)鼠標(biāo)移入圖片放大的效果。

/* html */
<img src="cat.jpg" class="cat">
/* css */
.cat {
transition: all 0.3s ease-in-out; /* 過渡效果 */
}
.cat:hover {
transform: scale(1.2); /* 放大效果 */
}

通過上述代碼，我們可以看到我們?yōu)閳D片添加了`.cat`這個(gè)class，接著給它添加了一個(gè)`transition`屬性，這個(gè)屬性是設(shè)置變化的運(yùn)動(dòng)，這里設(shè)置了一個(gè)`ease-in-out`，可以讓圖片有一個(gè)平滑過渡的動(dòng)畫效果。

接下來，我們?yōu)樗砑恿艘粋€(gè):hover效果，即當(dāng)鼠標(biāo)懸浮在圖片上時(shí)發(fā)生變化。其中，我們使用了`transform`屬性來實(shí)現(xiàn)當(dāng)前圖片放大的效果。`scale(1.2)`表示放大1.2倍，同時(shí)圖片周圍的空白區(qū)域也會(huì)跟著放大。

通過這段簡單的代碼，我們就可以實(shí)現(xiàn)鼠標(biāo)移入圖片放大的效果了！