CSS - A Visited


CSS - A Visited

  • The A: visited selector is used to select visited links.
  • The link in the browser window changes to the specified color in CSS after visited by the user.

Sample Code :

<!DOCTYPE html>
<html>
<head>
    <style>

        a: link
        {
            text-decoration: underline;
            color: #0676b3;
        }
        a: visited
        {
            color: #ff00ff;
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <p>                              
        <b>

            <a href="http://www.wikitechy.com/"target="_blank">
                Welcome to Wikitechy!
            </a>
        </b>
    </p>
</body>
</html>

Code Explanation :

    a: link indicates the “unvisited link”.

    Over here, we have given the text-decoration: underline for underlining anchor link and its hex color value of our anchor link.

Note : Mostly all the anchor link will be underlined, if we don’t want underlined anchor link ,then we can type text decoration: none instead of underline.


    a: visited is the link where the user has been visited. Here, we have given pink color in hexadecimal code for visited link. Therefore, it changes from normal blue(#0676b3) to pink color(#ff00ff).

    Over here, we are given text-decoration: underline for underlining the anchor link. 

    href is the attribute which specifies the destination address.

    target="_blank" Opens up the Link new tab.

Output :

  • Here in this output, when we open up the html file which is embedded with CSS, it will display the following window as shown below.


    The link “welcome to wikitechy!” will appear in blue color and underlined before clicking the link.

  • Welcome to wikitechy link directs us to the official wikitechy website. Which is displayed below.



    The link “Welcome to Wikitechy!” color change from blue to pink after user clicks the link stating that “the link is already opened”.