這篇文章帶給大家的內容是關於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>
相關建議:
CSS:hover選擇器_html/css_WEB-ITnose
以上是CSS:hover選擇器用法的簡單介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!