CSS3 Selectors: Pseudo class :hover

This entry is part 18 of 40 in the series CSS3 Selectors

There are a few common pseudo classes such as :link, :hover, :visited, :active and :focus.

They are called pseudo as these elements can’t be targeted using the normal html tag.  For example, the hover example below is actually an action.

Let’s look at the simple hover class where a link could be highlighted to a different color when the mouse is over the link.

:hover can apply to any element on the page—not just links and form controls.

<!DOCTYPE html>
<head lang='en'>
    <meta charset='UTF-8'>
        a:hover {
            color: red;

<a href='http://google.com'>This is to google</a>
<a href='http://yahoo.com'>This is to yahoo</a>


Series Navigation<< CSS3 Selectors: Match a substring
CSS3 Selectors: Form control :focus >>