CSS是一項(xiàng)非常有用的技術(shù)，可以使你的網(wǎng)站變得更加生動、吸引人。其中一個CSS的技巧是根據(jù)鼠標(biāo)懸停狀態(tài)改變圖片。

img:hover {
opacity: 0.5;
}

以上代碼可以在鼠標(biāo)懸停時將圖片的透明度減半，從而實(shí)現(xiàn)改變圖片的效果。

除了使用opacity屬性改變圖片的透明度，我們還可以使用background-image屬性來替換圖片。以下是一個例子：

div {
width: 300px;
height: 300px;
background-image: url("image1.jpg");
}
div:hover {
background-image: url("image2.jpg");
}

以上代碼可以在DIV元素上設(shè)置背景圖片，并在鼠標(biāo)懸停狀態(tài)下將背景圖片更改為另一張圖片。

除此之外，還有一種更酷的技巧，可以利用CSS的transition屬性來實(shí)現(xiàn)平滑過渡效果。以下是一個例子：

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

以上代碼可以在鼠標(biāo)懸停狀態(tài)下將圖片放大1.2倍，并在0.3秒內(nèi)進(jìn)行平滑過渡。

總之，根據(jù)鼠標(biāo)懸停狀態(tài)改變圖片是一個非常有創(chuàng)意的技巧，可以讓你的網(wǎng)站變得更加生動、吸引人。只需要一些簡單的CSS代碼，就可以實(shí)現(xiàn)這種效果。