It is use to styling the link which we write in html ancor tag.
Syntax -
a:link_state{write any tag according to need like color, font, background, etc}
It is use to style a link that how it will look when
- not visited to the link,
- when visited to the link,
- when hover to the link
- when anyone click on the link.
When write the css link code then, some rules need to follow:
- a:hover MUST come after a:link and a:visited
- a:active MUST come after a:hover
The four links states are:-
- a:link - a normal, unvisited link.
- a:visited - a link visited by user.
- a:hover - a link hover by user over it.
- a:active - a link the moment it is clicked by user.
For example -
<!DOCTYPE html>
<html>
<head>
<title>technical sumit</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
a:link {
color: red;
background: white;
}
a:visited {
color: green;
}
a:hover {
color: hotpink;
background-color: yellow;
text-decoration: underline overline;
}
a:active {
color: blue;
}
</style>
</head>
<body>
<p><b><a href="https://www.teknowize.com/" target="_blank">This is alink</a></b></p>
</body>
</html>
Output