For
example,
p:?¬? rst-line{font-variant:small-caps;}
results in the ?¬? rst line, not surprisingly, being in small capital letters.
If you have a liquid layout where the line length changes as
the browser window is sized, words automatically change format as
required so that only the ?¬? rst line is styled in this way. (All SCBs and
IE7 support :?¬? rst-letter and :?¬? rst-line.)
These two pseudo-classes
x:before and x:after
cause speci?¬? ed text to be added in before and after an element, so
this markup
25
and these styles
h1.age:before {content:"Age: "}
h1.age:after {content:" years old."}
Where x is a tag name
Where x is a tag name
Because search engines can??™t pick up
pseudo-element content (it doesn??™t
appear in the markup), don??™t use
these elements to add important
content that you want a search
engine to index.
HOW CSS WORKS 53
result in text that reads ???Age: 25 years old.??? Note that the spaces
added inside the quoted content strings ensure proper spacing in
the resultant output. These two selectors are especially useful when
the tag??™s content is being generated as a result of a database query; if
all the result contains is the number, then these selectors allow you
to provide that data point with some meaningful context when you
display it for the user. (IE7 does not support :before and :after.
Pages:
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86