伪类和所有 CSS 类

cssweb developmentfront end technology更新于 2025/12/16 6:36:17

伪类关键字用于指定添加选择器的特殊状态。这赋予我们更多控制权,现在我们可以在选择器处于特定状态时对其进行定位,例如:悬停、选中、访问等。

以下代码演示了 CSS 中的伪类 −

示例

<!DOCTYPE html>
<html>
<head>
<style>
body {
   font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
a {
   font-size: 18px;
   font-weight: bold;
}
a:link {
   color: rgb(17, 0, 255);
}
a:visited {
   color: rgb(128, 0, 107);
}
a:hover {
   color: rgb(255, 105, 243);
}
a:active {
   color: rgb(255, 153, 0);
}
</style>
</head>
<body>
<h1>Pseudo class example</h1>
<a href="#">This is some sample link text</a>
<h2>Hover , click on the above link to see the pseudo class in action</h2>
</body>
</html>

输出

上述代码将产生以下输出 −

将鼠标悬停在链接上方时 −

点击链接时 −

再次返回同一页面,链接状态变为已访问。


相关文章


有用资源