HTML5, CSS3, and JavaScript Fourth Edition

(Ben Green) #1

CHAPTER 11. HOVER AND PSEUDO CLASSES 116


Pseudo classes and pseudo elements allow us to style things even without
special markup. In this chapter we explore some of them. The list of pseudo
classes seems to be constantly growing, and they let you do some really fun
stuff, so there are lots of tutorials out there.


Exam Question 204(p.348): What does pseudo mean?
Acceptable Answer:fake


Pseudo means fake or false. It is fake in the sense that there is no explicit,
static markup that it targets. Instead it is based on things that are implicit
or dynamic.


11.1 Link Styling


We can style links differently depending on whether they have been visited
or not. Let’s make unvisited links bold and green, and visited links italic
and red.


:link { color: green; font-weight: bold; }
:visited { color: red; font-style: italic; }


Put this into the style sheet of a webpage, and then create a few links and
see how their styling changes as the links are visited.


Exam Question 205(p.348): What is the prefix for pseudo-class?
Required Answer::


The prefix symbol for pseudo-class is:(colon).


Exam Question 206(p.348):What is the pseudo-class for a visited link?
Required Answer::visited


:visited- change the style of an a-link element when we can tell it has been
visited.


Exam Question 207(p.348): What is the pseudo-class for an unvisited
link?
Required Answer::link


:link- change the style of an a-link element when we can tell it has not been
visited.


There is also a pseudo-class for a link that is active, which really only takes
effect during the moment that the link is being clicked (from mouse down

Free download pdf