CSS中，鼠標(biāo)滑過圖片上浮是一種常見的效果。

實(shí)現(xiàn)此效果的方法是，為圖片添加CSS樣式

transform: translateY(-3px);

。

這里的

translateY

可以調(diào)整圖片在Y軸上的位置，負(fù)值會(huì)向上移動(dòng)圖片，正值則會(huì)向下。

同時(shí)，我們可以添加CSS過渡效果，使得圖片移動(dòng)時(shí)有一定的緩動(dòng)效果：

img:hover{
transition: all 0.3s ease-in-out;
transform: translateY(-3px);
}

其中，

transition

屬性用于設(shè)置過渡效果的屬性、延時(shí)時(shí)間和加速/減速函數(shù)，這里的all表示對(duì)所有屬性進(jìn)行過渡，0.3s是過渡時(shí)間，ease-in-out則是常見的緩動(dòng)函數(shù)。

這樣，當(dāng)鼠標(biāo)滑過圖片時(shí)，圖片就會(huì)上浮一定距離，有時(shí)還會(huì)同時(shí)添加一些陰影效果，使得整體效果更加美觀。

總之，鼠標(biāo)滑過圖片上浮是一種簡(jiǎn)單而實(shí)用的CSS效果，可以為網(wǎng)頁增加一些動(dòng)態(tài)感和交互性。