visited Pseudo-class
This pseudo-class is used to select the links which have been already visited by the user. In the following example, the color of the link changes once it is visited.
Example: This example shows the visited pseudo-class in CSS.
<!DOCTYPE html>
<html>
<head>
<title>CSS transition-property property</title>
<style>
body{
text-align: center;
}
h1, h2{
color: green;
}
a:visited{
color: red;
}
</style>
</head>
<body>
<h1>Geeks For Geeks</h1>
<h2>:visited Pseudo-class</h2>
<p>
<a href="https://www.w3wiki.org/" target="_blank">
My color changes once you visit this link
</a>
</p>
</body>
</html>
Output:
CSS Pseudo-classes
CSS Pseudo-classes are powerful and allow developers to style elements based on their specific states. This guide will walk you through the most commonly used pseudo-classes and how to use them effectively.
Pseudo-classes in CSS are used to define the special state of an element. They can be combined with a CSS selector to add an effect to existing elements based on their states. For instance, you can change the style of an element when the user hovers over it, or when a link is visited. All of these can be achieved using Pseudo Classes in CSS.
Note that pseudo-class names are not case-sensitive.
Syntax:
selector: pseudo-class{
property: value;
}
There are many Pseudo-classes in CSS but the ones that are most commonly used are as follows:
Contact Us