CSS可以通過hover偽類來實現鼠標懸停時圖片變亮的效果。
img:hover{ filter: brightness(120%); }
通過設置圖片的鼠標懸停樣式,可以調整圖片的亮度,例如這里的brightness(120%)表示將圖片亮度增加20%。
除了亮度,還可以設置圖片的對比度、飽和度等屬性,來實現不同的效果。
img:hover{ filter: contrast(150%) saturate(120%); }
這里的contrast(150%)表示對比度增加50%,saturate(120%)表示飽和度增加20%。
在實際應用中,可以結合JavaScript通過事件監聽來動態更改圖片的樣式,實現更加豐富的效果。
上一篇css網頁小圖標大小