Graphics Programs Reference
In-Depth Information
(And technically the universal selector is optional in that case; you can write simply :target
for the selector.)
If you're looking to go a little more Web 2.0 with the targeting style, you could set up a
fading-background ef ect. You know, that whole “you've done something, so a piece of the
page's background will go from yellow to white to let you know you've done it” thing. You can
do that fairly easily with :target and an animated GIF. Just create an animation that's a fade
from yellow to white (if that's your site's background color) and use it as a background image.
*:target { background : url(/pix/yellow-fade.gif) ;}
It's hard to say three times quickly and can be even harder to thoroughly grasp, but it's the key
to understanding how CSS rules interact with each other.
Specii city is a numeric representation of the “specii c-ness” of a selector. h ere are three
things that are used to determine a selector's specii city:
Every element descriptor contributes 0,0,0,1.
Every class, pseudo-class, or attribute descriptor contributes 0,0,1,0.
Every ID descriptor contributes 0,1,0,0.
Don't freak out (yet)! Take a look at a few examples i rst.
div ul ul li
Four element descriptors
div.aside ul li
One class descriptor, three element descriptors
One pseudo-class descriptor, one element descriptor
One pseudo-class descriptor, one class descriptor, two element
#title em
One ID descriptor, one element descriptor
h1#title em
One ID descriptor, two element descriptors
Hopefully, this begins to give you an idea of how specii city values are built up. Now, why the
commas? Because each “level” of specii city value stands on its own, so to speak. h us, a
selector with a single class descriptor has more specii city than a selector with 13 element
descriptors. h eir values would be:
.aside /* 0,0,1,0 */
div table tbody tr td div ul li ol li ul li pre /* 0,0,0,13 */
h e “1” in the third position of the i rst selector beats the “0” in the third position of the
second selector. Given that fact, the “13” in the fourth position of the second selector means
Search WWH ::

Custom Search