Pages

Saturday, March 19, 2011

CSS Reference

CSS Selectors

In CSS, selectors are patterns used to select the element(s) you want to style.
The "CSS" column indicates in which CSS version the property is defined (CSS1 or CSS2).
Selector Example Example description CSS
.class .intro Selects all elements with class="intro" 1
#id #firstname Selects the element with id="firstname" 1
* * Selects all elements 2
element p Selects all <p> elements 1
element,element div,p Selects all <div> elements and all <p> elements 1
element element div p Selects all <p> elements inside <div> elements 1
element>element div>p Selects all <p> elements where the parent is a <div> element 2
element+element div+p Selects all <p> elements that are placed immediately after <div> elements 2
[attribute] [target] Selects all elements with a target attribute 2
[attribute=value] [target=_blank] Selects all elements with target="_blank" 2
[attribute~=value] [title~=flower] Selects all elements with a title attribute containing the word "flower" 2
[attribute|=language] [lang|=en] Selects all elements with a lang attribute value starting with "en" 2
:link a:link Selects all unvisited links 1
:visited a:visited Selects all visited links 1
:active a:active Selects the active link 1
:hover a:hover Selects links on mouse over 1
:focus input:focus Selects the input element which has focus 2
:first-letter p:first-letter Selects the first letter of every <p> element 1
:first-line p:first-line Selects the first line of every <p> element 1
:first-child p:first-child Selects every <p> elements that is the first child of its parent 2
:before p:before Insert content before every <p> element 2
:after p:after Insert content after every <p> element 2
:lang(language) p:lang(it) Selects every <p> element with a lang attribute value starting with "it" 2

No comments:

Post a Comment