CSS3可以很好地實(shí)現(xiàn)鼠標(biāo)滑過(guò)效果，這對(duì)于網(wǎng)頁(yè)設(shè)計(jì)來(lái)說(shuō)是非常重要的。通過(guò)CSS3的高級(jí)控制方法，我們可以讓網(wǎng)頁(yè)上的元素在鼠標(biāo)滑過(guò)或點(diǎn)擊時(shí)呈現(xiàn)出不同的效果。下面我們來(lái)一起來(lái)看一下如何使用CSS3實(shí)現(xiàn)鼠標(biāo)滑過(guò)效果。

/*定義hover時(shí)的樣式*/
div:hover {
background: #FFF;
color: #000;
border: 1px solid #000;
}

在上面的代碼中，我們使用了:hover偽類來(lái)定義鼠標(biāo)滑過(guò)時(shí)元素應(yīng)該呈現(xiàn)的樣式。在這個(gè)例子中，當(dāng)鼠標(biāo)滑過(guò)一個(gè)div元素時(shí)，其背景色將變成白色，文字顏色將變成黑色，邊框樣式將變成1像素寬的實(shí)線。

在CSS3中，還有一些其他的偽類也可以用來(lái)實(shí)現(xiàn)鼠標(biāo)滑過(guò)效果。例如，使用:focus偽類可以實(shí)現(xiàn)當(dāng)元素被聚焦時(shí)的效果，使用:active偽類可以實(shí)現(xiàn)當(dāng)元素被點(diǎn)擊時(shí)的效果。在這些偽類中， :hover是最常用的一個(gè)，因?yàn)樗軌驅(qū)崿F(xiàn)鼠標(biāo)滑過(guò)時(shí)最簡(jiǎn)單的效果。