伪类选择器

冷不防 2022-02-04 13:49 530阅读 0赞 
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4.     <meta charset="utf-8"/>
  5.     <title>实现vivo X9s手机的宣传面面</title>
  6.     <!-- 引用CSS样多文件，路径、类型、与当前文件关系 -->
  7.     <link href="css/style.css" type="text/css" rel="stylesheet" />
  8. </head>
  9. <body>
  10.     <a href="#" target="_self">我是超链接标记，我未点击前颜色为黑色</a><br/>
  11.     <a href="#" target="_self">我是超链接标记，我点击后颜色为红色</a><br/>
  12.     <a href="#" target="_self" class="hov">我是超链接标记，鼠标在我身上悬停显示出边框</a><br/>
  13.     <a href="#" target="_self" class="act">我是超链接标记，鼠标点击时我身后出现蓝色背景颜色</a>
  14. </body>
  15. </html>
  17. @charset "utf-8";
  18. /*css document*/
  19. a:visited{/*表示对访问超接后链接进行样式*/
  20.     color: red;/*设置期字体颜色为红色*/
  21. }
  22. a:link{/*表示对未访问的超链接进行样式*/
  23.     color: black;/*设置其字体为黑色*/
  24. }
  26. .hov:hover{/*表示对鼠标停留的类为为hov的元素应用样式*/
  27.     border: 1px solid blue;/*添加边框*/
  28. }
  29. .act:active{/*表示对鼠标点击类名为act的名素应用样式*/
  30.     background: yellow;/*设置其背景颜色为黄色*/
  31. }

发表评论

表情：
评论列表 （有 0 条评论，530人围观）

还没有评论，来说两句吧...

相关阅读