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 .link{ 9 font-size: 30px; 10 text-decoration: none; 11 color: red; 12 } 13 .link:hover{ 14 color: gold; 15 } 16 /*伪元素*/ 17 .box1:before{ 18 content: "前面的文字"; 19 color: blue; 20 } 21 22 .box2:after{ 23 content: "后面的文字"; 24 color: pink; 25 } 26 </style> 27 </head> 28 <body> 29 <a href="https://wwww.baidu.com" class="link">百度链接</a> 30 <div class="box1">这是第一个div</div> 31 <div class="box2">这是第二个div</div> 32 33 </body> 34 </html>