Using Hyperlink Styles


You can set the colors of hyperlinks using these pseudo-classes :

  • A:link refers to hyperlinks as they originally appear, before they've been visited.

  • A:visited refers to hyperlinks that have been visited.

  • A:hover refers to hyperlinks that have the cursor over them.

  • A:active refers to hyperlinks that are activethat is, being clicked.

A pseudo-class works something like a class; you set it up in a <STYLE> element. To set the color of visited hyperlinks to purple, for example, you assign the color property of the A:visited to "purple" .

Tip

Note in particular the hover pseudo-class, which enables you to set the color of a hyperlink as the cursor moves over it without any additional programming.


Here's an example. In this case, I'm setting the color of hyperlinks to green, visited links to yellow, links with the cursor over them to red, and active links (as they're being clicked) to blue:

(Listing 21-08.html on the web site)
 <HTML>      <HEAD>          <TITLE>Setting Hyperlink Colors</TITLE>  <STYLE type="text/css">   A:link {color: green}   A:visited {color: yellow}   A:hover {color: red}   A:active {color: blue}   </STYLE>  </HEAD>      <BODY>          <H1>              Setting Hyperlink Colors          </H1>  Here's a link: <A HREF="http://www.w3c.org">W3C</A>.  </BODY>  </HTML> 


Inside Javascript
Inside JavaScript
ISBN: 0735712859
EAN: 2147483647
Year: 2005
Pages: 492
Authors: Steve Holzner

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net