普通链接和活动链接之间的区别

超链接，也称为链接，是现今网站中至关重要的组件。这些链接可以被点击，并且可用于在源网页与不同页面或同一网页中的不同部分之间导航。

在大多数网站中，链接会显示为下划线和不同的颜色。链接分为以下几种类型：

未访问的链接
已访问的链接
活动链接

让我们在本文中进一步讨论上述链接，并提供适当的示例。

未访问的链接

在HTML中，未访问的链接是用户尚未点击的超链接。默认情况下，未访问的链接将以蓝色和下划线形式呈现。然而，我们可以使用CSS属性（ a:link ）自定义样式。

示例

在下面的示例中，我们创建了一个没有使用CSS属性进行任何自定义的超链接。

<html>
<head>
   <title>Difference between normal links and active links</title>
</head>
<body>
   <h3>Click here to visit → <a href="https://www.tutorialspoint.com/">Tutorialspoint</a>
   </h3>
</body>
</html>

从输出结果中可以看出，超链接以默认的蓝色和带有下划线的样式显示。

访问过的链接

访问过的链接是用户点击过的超链接。这些链接表示之前已经访问过。默认情况下，在大多数浏览器中，访问过的链接将以紫色和带有下划线的样式显示出来。然而，我们可以使用CSS属性（a:visited）自定义访问过的链接的样式。

例子

在下面的例子中，我们创建了一个超链接，并使用CSS属性自定义了样式。

<html>
<head>
   <title>Difference between normal links and active links</title>
   <style>
      a:visited {
         color: purple;
         background-color: transparent;
         text-decoration: none;
      }
   </style>
</head>
<body>
   <h3>Click here to visit → <a href="https://www.tutorialspoint.com/">Tutorialspoint</a>
   </h3>
</body>
</html>

在点击链接后，它会将您重定向到目标页面，如果您返回原始页面，您会发现链接的颜色变为紫色。这表示您已经点击了链接并访问了目标页面。

活跃链接

活跃链接是用户当前正在与之交互的超链接。每当用户按住鼠标按钮不放，或者右键单击链接时，链接的颜色会变为红色，这时链接处于活动状态。活动状态是临时的，在用户释放鼠标按钮后即结束。但是，我们可以使用CSS属性（a：active）自定义活动链接的样式。

示例

在以下示例中，我们创建了一个超链接，并使用CSS自定义了其样式。

<html>
<head>
   <title>Difference between normal links and active links</title>
   <style>
      a:hover {
         color: red;
         background-color: transparent;
         text-decoration: underline;
      }
      a:active {
         color: yellow;
         background-color: transparent;
         text-decoration: underline;
      }
   </style>
</head>
<body>
   <h3>Click here to visit → <a href="https://www.tutorialspoint.com/">Tutorialspoint</a>
   </h3>
</body>
</html>

如果你将鼠标悬停在链接上或右键点击链接，它的颜色会变为红色。这是用户与链接互动时发生的情况。