CSS 基础学习-102 css 使用a元素链接的四种状态

由 hrs, 14 十月, 2021

四种链接状态分别是：

  • a:link - 正常的，未访问的链接
  • a:visited - 用户访问过的链接
  • a:hover - 用户将鼠标悬停在链接上时
  • a:active - 链接被点击时

实例代码：

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <style>
      a{
        font-size:30px;
     }
      p{
        color:red;
      }
      a:link{
        color:;#2440b3  /*未访问的链接*/
      }
      a:visited{
        color:green;/*已访问的链接*/
      }
      a:hover{
      color:#42a9f4;  /*当鼠标移动到链接时*/
      }
      a:active{
        color:red;/*按下链接时*/
      }
    </style>
  </head>
  <body>
    <h1>css 四种链接状态</h1>
    <p><b><a href="https://www.dwoke.com" target="_blank">你行网</a>
    </b></p>
    <p>注：移动鼠标到链接感受链接颜色的变化。</p>
      </body>
</html>

运行效果：

css-102.png

 

标签

评论