Basic HTML Version

|  | Table of Contents |  | View Full Version

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

| 84 85 86 87 88 89 90 91 92 93 94 |