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(删除线)