CSS中懸浮效果可以使用:hover 偽類來(lái)實(shí)現(xiàn),它可以應(yīng)用于各種HTML元素:文本,圖像、按鈕等等。
例如,想要實(shí)現(xiàn)當(dāng)鼠標(biāo)懸浮在按鈕上時(shí)改變按鈕顏色的效果可以使用以下CSS代碼:
button:hover { background-color: #ff0000; }
這段代碼的意思是當(dāng)鼠標(biāo)懸浮在button標(biāo)簽上時(shí),將按鈕的背景顏色改為紅色。
除了改變背景顏色,還可以使用:hover實(shí)現(xiàn)其他效果,比如改變字體大小、顯示文字、改變邊框等。例如,下面這個(gè)示例代碼實(shí)現(xiàn)鼠標(biāo)懸浮在文本上時(shí)顯示下劃線的效果:
p:hover { text-decoration: underline; }
這段代碼的意思是當(dāng)鼠標(biāo)懸浮在p標(biāo)簽上時(shí),添加下劃線樣式到p標(biāo)簽中的文本。
總之,使用:hover偽類可以讓網(wǎng)站更加生動(dòng)有趣,給用戶帶來(lái)更好的體驗(yàn)。