:FIRST-CHILD
x:?¬? rst-child
This pseudo-class selects the ?¬? rst-child element with the name x.
For example, if this rule
div.weather strong:?¬? rst-child {color:red;}
is applied to this markup
It??™s very hot and incrediblystrong> humid.
then very is red and incredibly is not.
See Figure 2.17.
(SCBs and IE7 support :?¬? rstchild.)
FIGURE 2.17 First-child selectors
enable you to target the ?¬? rst tag of a
particular type with a set of tags.
:FOCUS
x:focus
An element such as a text ?¬? eld of a form is said to have focus when
the user clicks it; that??™s where the characters appear when the user
types. For instance, the code
Where x is a tag name
Where x is a tag name
STYLIN??™ WITH CSS - CHAPTER 2 52
input:focus {border: 1px solid blue;}
puts a blue border around such a ?¬? eld when the user clicks it. (IE6,
IE7 and Safari do not support :focus.)
Pseudo-Elements
Pseudo-elements provide the effect of extra markup elements magically
appearing in your document, although you don??™t actually add
any extra markup. Here are some examples.
This pseudo-class
x:?¬? rst-letter
For example:
p:?¬? rst-letter {font-size:300%; ?¬‚ oat:left;}
enables you, for example, to create a large drop-cap effect at the
start of a paragraph.
This pseudo-class
x:?¬? rst-line
enables you to style the ?¬? rst line of (usually) a paragraph of text.
Pages:
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85