鏈接偽類
阿新 • • 發佈:2018-05-26
鼠標 line one pre type 文本 color erl active
text-decoration:none(沒有下劃線) underline(有下劃線) line-through(刪除線)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 /* 鏈接默認狀態 */ 8 a:link{ 9 color:red; 10 /* 默認沒有下劃線 */ 11 text-decoration:none; 12 } 13 /* 鏈接訪問之後的狀態 */ 14 a:visited{ 15 color:pink; 16 } 17 /* 鼠標放到鏈接上顯示的狀態 */ 18 a:hover{ 19 color:#958304; 20 /* 鼠標經過有下劃線 */ 21 text-decoration:underline; 22 23 } 24 /* 鏈接激活的狀態 */ 25 a:active{ 26 color:yellow; 27 } 28 29 </style> 30 </head> 31 <body> 32 <a href="#">大家</a> 33 </body> 34 </html>
鏈接偽類:
寫法:a:link{屬性:值;}與a{屬性:值;}效果一樣
a:link{屬性:值;}鏈接默認狀態
a:visited{屬性:值;}鏈接訪問之後的狀態
a:hover{屬性:值;}鼠標放到鏈接上顯示的狀態
a:active{屬性:值;}鏈接激活的狀態(鼠標按在鏈接上不動)
:focus{屬性:值;}獲取焦點
文本修飾:
text-decoration:none(沒有下劃線) underline(有下劃線) line-through(刪除線)
鏈接偽類