Home > Articles > Graphics & Web Design > Dreamweaver & Flash

  • Print
  • + Share This
This chapter is from the book

Creating a Hyperlink Rollover

The third type of style is a CSS Selector. This type of style redefines a group of HTML tags instead of just one. For instance, you could define what a specific heading tag looks like only within a table cell by entering the table cell tag, <td>, and then the paragraph tag, <p>. To do this, you enter all of the tag names in the Selector box, as shown in Figure 15.9, and then define the style.

Figure 15.9 You can define attributes for multiple HTML tags with CSS Selector styles in the New Style dialog box.

Creating hyperlink rollovers is a common and fun use of CSS Selector styles. These CSS Selector styles redefine the anchor (<a>) tag, the tag that is used in hyperlinks. Define an anchor style that makes the link color change when the user has his cursor positioned over a hyperlink. To create a hyperlink rollover

  1. Create a new style and select the radio button beside Use CSS Selector.

  2. The Selector drop-down menu displays the four link styles, shown in Figure 15.10. Select the a:hover selector to add a rollover to all of the hyperlinks in your Web page. Click OK.

  3. Figure 15.10 The four link styles appear in the drop-down menu when you select the Use CSS Selector radio button.

  4. The Style definition dialog box appears. In the Type category, select a color and then press OK.

To see the selector, create a hyperlink in your Web page. Save the page and preview it in Internet Explorer. When your cursor is over the hyperlink, it changes color! This effect works only in Internet Explorer and Netscape 6 and above; in Netscape 4, the hyperlink appears as usual, without the rollover effect.

  • + Share This
  • 🔖 Save To Your Account