Page 89 - 2633 Trackpad Pro V5.1 Class 7
P. 89
HYPERLINK WITH CSS
We can set the following properties of a hyperlink using CSS:
a:link This property signifies the unvisited hyperlinks.
a:visited This property signifies visited hyperlinks.
a:hover This property signifies a hyperlink on which the user’s mouse is hovering.
a:active This property signifies a hyperlink on which the user is currently clicking.
These properties are usually specified in the header part of the HTML document. But, a:hover
property must be specified after a:link and a:visited in the CSS definition to make it effective and
a:active is specified after a:hover in the CSS definition.
HTML codes to set the hyperlink properties using CSS:
<!DOCTYPE HTML>
<HTML>
<HEAD>
<STYLE>
/*Unvisited Link */
A:Link {Color: Red}
/*Visited Link */
A:Visited {Color: Green}
/*Mouse over Link */
A:Hover {Color: hotpink}
/*Selected Link */
A:Active {Color: Blue}
</STYLE>
</HEAD>
<BODY>
<H1 STYLE = "text-align:center">Valley of Flowers </H1>
<IMG STYLE = "border:4px solid black; height:200px; width:250px;"
SRC = "D:\Valley_of_Flower.jpg" > <br>
<A HREF = "https://uttarakhandtourism.gov.in/destination/valley-of-
flowers">
Click here to visit official website </A>
</BODY>
</HTML>
Styling Elements using CSS 87
