本篇文章給大家帶來的內容是關於CSS:hover選取器用法的簡單介紹 ,有一定的參考價值,有需要的朋友可以參考一下,希望對你有所協助。
:hover在滑鼠移到連結上時添加的特殊樣式。
提示: :hover 選取器器可用於所有元素,不僅是連結。
提示: :link 選取器設定了未訪問過的頁面連結樣式, :visited 選取器設定訪問過的頁面連結的樣式 :active選取器設定當你點選連結時的樣式。
注意: 為了產生預期的效果,在 CSS 定義中,:hover 必須位於 :link 和 :visited 之後!!
<style media="screen"> .pagination li {line-height: 25px;list-style-type:none;}.pagination a {display: block;color: #f2f2f2;text-shadow: 1px 0 0 #101011;padding: 0 10px;border-radius: 2px;box-shadow: 0 1px 0 #5a5b5c inset,0 1px 0 #080808;background: linear-gradient(top,#434345,#2f3032);}.pagination a:hover {text-decoration: none;box-shadow: 0 1px 0 #f9bd71 inset,0 1px 0 #0a0a0a;background: linear-gradient(top,#f48b03,#c87100);} </style> <body> <div class="pagination"> <ul> <li><a href="#">Prev</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">4</a></li> <li><a href="#">5</a></li> <li><a href="#">Next</a></li> </ul> </div> </body>