Format the navigation bar text 123
Add a rollover effect
Now you’ll add a rollover effect so that the background color of the
navigation bar blocks change whenever the mouse pointer passes over one
of the links. To add a rollover effect, add a new rule that contains the
:hover pseudo-class.
1.
Open the cafe_townsend.css file.
2.
Select the entire .navigation rule.
3.
Copy the text (Edit > Copy).
ABO
U
T.
..
About the :hover pseudo-class
A pseudo-class is a means of affecting certain elements in an HTML
document, based not on the HTML code of the document itself, but on other external conditions applied
by the web browser. Pseudo-classes can be dynamic, in the sense that an element on the page may
acquire or lose the pseudo-class while a user interacts with the document.
The :hover pseudo-class affects a change in a formatted page element when the user holds the mouse
over the element. For example, when the :hover pseudo-class is added to the .navigation class style
(.navigation:hover) to create a new rule, all text elements that the .navigation rule formats change
according to the .navigation:hover rule’s properties.
Summary of Contents for DREAMWEAVER 8-GETTING STARTED WITH...
Page 1: ...Getting Started with Dreamweaver...
Page 8: ...8 Contents...
Page 10: ......
Page 46: ...46 Dreamweaver Basics...
Page 48: ......
Page 128: ...128 Tutorial Formatting Your Page with CSS...
Page 136: ...136 Tutorial Publishing Your Site...
Page 138: ......
Page 189: ...Add a Repeat Region XSLT object 189 3 Select Insert XSLT Objects Repeat Region...
Page 196: ...196 Tutorial Displaying XML Data...
Page 216: ......
Page 230: ...230 Understanding Web Applications...
Page 236: ...236 Installing a Web Server...
Page 254: ...254 Setup for Sample ColdFusion Site...
Page 268: ...268 Setup for Sample ASP NET Site...
Page 284: ...284 Setup for Sample ASP Site...
Page 300: ...300 Setup for Sample JSP Site...
Page 320: ...320 Setup for Sample PHP Site...