CSS: Additional Hyperlink styles

This entry is part 9 of 26 in the series Basic CSS

There are 3 additional hyperlink styles that we can use.

  • focus: This is used by links that are selected by using the keyboard.
  • hover:  This is used to change the appearance of a link the the mouse is positioned over it.
  • active: This is used for a link when it is clicked. This is momentarily and immediately after being clicked, the link changes to the visited state.
<!DOCTYPE html>
<html>
<head lang='en'>
        
    <meta charset='UTF-8'>
    <title>Codecrawl.com-Hyperlinks</title>
    <style type='text/css'>
        a:link {
            color: navy
        }

        a:visited {
            color: magenta
        }

        a:hover {
            color: lime
        }

        a:active {
            color: red
        }
    </style>
</head>
<body>

<a href='//nytimes.com'>Click Me</a>

</body>
</html>
Series Navigation<< CSS: Applying styles to hyperlinks
CSS: Specifying a font family >>