The Any Selector


The "Any" Selector

The final type of selector in CSS2.1 is a selector that simply selects all elements. It can be used to set a property on all elements, but that is a rare occurrence. It can also be used in combination with the child selector to count ancestors. Here is an example of the "any" selector used on its own:

 * { cursor: auto } 

This resets the shape of the mouse pointer to the browser's default. This quickly undoes all changes to the mouse cursor. If the style sheet that comes with a document makes it difficult to find the hyperlinks, this might be a useful rule to have in a user's style sheet.

Another place where the "any" selector might come in handy is in selectors that must match only at a certain depth in the document tree. For example, to select all paragraphs except those that are children of the BODY element, this rule will do this:

 BODY * P { font: medium "gill sans", sans-serif } 

This matches P elements that are descendants of any element that is a descendant of BODY. Therefore, it excludes P elements that are children of BODY itself.

A final way to use the "any" selector is for purely aesthetic reasons. If you like all of your selectors to start with an element name, you can use the * in places where the element name doesn't matter:

 *[BORDER] { border: solid } *.POLONIUS { font-weight: bold } *:hover { color: inherit; background: inherit } 

In these cases, the "any" selector is used merely to avoid starting a selector with a flag character. It is a matter of taste.

Table 4.2 summarizes all selectors in CSS2.1.

Table 4.2. Overview of the building blocks of selectors.

Pattern

Matches

*

Any element.

E

Any E element (i.e., element of type "E").

F E

Any E element that is a descendant of an F element.

F > E

Any E element that is a child of an F element.

F + E

Any E element that immediately follows an F element.

.class

Any element with class "class."

#id

The element with ID "id."

:first-child

Any E element that is the first child of its parent.

:link

Any element that is an unvisited hyperlink.

:visited

Any element that is a visited hyperlink.

:active
:hover
:focus

Any element that is "activated" by the user; respectively: (1) an action has started but not completed; (2) the mouse "hovers" over the element; (3) the element is ready to receive keyboard input.

:active

Any element that is "activated" by the user, e.g., by clicking it.

:hover

Any element that the mouse pointer "hovers" over.

:focus

An element that is ready to receive keyboard input.

:lang(C)

Any element whose content is in (human) language C.

[att]

Any element with an "att" attribute.

[att="val"]

Any element with an "att" attribute with value "val."

[att~="val"]

Any element with an "att" attribute that includes the word "val."

[att|="val"]

Any element with an "att" attribute of the form "val-..."

x, y

Grouping: any element that matches x or y.

E:first-letter

The first letter of any (block) element E.

E:first-line

The first line of any (block) element E.

E:before

The text inserted at the start of any E element.

E:after

The text inserted at the end of any E element.




Cascading Style Sheets(c) Designing for the Web
Cascading Style Sheets: Designing for the Web (3rd Edition)
ISBN: 0321193121
EAN: 2147483647
Year: 2003
Pages: 215

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net