:hover 選擇器 · CSS基礎

## :hover 選擇器 ### 定義和用法 :hover在鼠標移到鏈接上時添加的特殊樣式。 :hover是一個偽類，它適用于處于懸停狀態的元素。最常見的例子是將鼠標指針移動到超鏈接的邊界內。 **例子：** ~~~ a[href]:hover {text-decoration: underline;} p:hover {background: yellow;} ~~~ **提示:** :hover選擇器可用于所有元素，不僅是鏈接。 **提示:** [:link](https://www.w3cschool.cn/cssref/sel-link.html) 選擇器設置了未訪問過的頁面鏈接樣式, [:visited](https://www.w3cschool.cn/cssref/sel-visited.html) 選擇器設置訪問過的頁面鏈接的樣式[:active](https://www.w3cschool.cn/cssref/sel-active.html)選擇器設置當你點擊鏈接時的樣式。 **注意:** 為了產生預期的效果，在 CSS 定義中，:hover 必須位于 :link 和 :visited 之后！！ ## 實例--選擇鼠標移到鏈接上的樣式： ``` <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>W3Cschool教程(w3cschool.cn)</title> <style> a:hover { background-color:yellow; } </style> </head> <body> <a href="http://www.w3cschool.cn">w3cschool.cn</a> <a href="http://www.wikipedia.org">wikipedia.org</a> <p><b>注意:</b> 當鼠標移動到鏈接上 :hover選擇器樣式鏈接到該超鏈接.</p> </body> </html> ```