04.06.2013 Views

Head First HTML with CSS

Head First HTML with CSS

Head First HTML with CSS

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

using pseudo-classes for links<br />

Test drive the links<br />

When you reload you should see some new<br />

style in the elixirs section. Keep in mind, to see<br />

the unvisited links you may have to clear your<br />

browser’s history, otherwise the browser will<br />

know you’ve visited these links before.<br />

Sharpen your pencil<br />

472 Chapter 11<br />

Now we’ve got green unvisited<br />

links, gray visited links, and a<br />

very cool red highlight when<br />

you hover over the link.<br />

Your job is to give the “detailed directions” link in the lounge some style. Just like the elixirs<br />

link, we want all unvisited links to be aquamarine, and all visited links to be gray. However,<br />

we don’t want the other links in the lounge to have any hover style... that’s unique to the<br />

elixirs. So, how would you do it? Fill in the blanks to give the “detailed directions” link, and<br />

any other links you might add to the lounge later, this style. Check your answer in the back of<br />

the chapter and then make the changes in your lounge files.<br />

____________ { __________: #007e7e; }<br />

____________ { __________: #333333; }

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!