dinky pocket book - CSS Selectors 10September2009 10

Document Sample
dinky pocket book - CSS Selectors 10September2009 10 Powered By Docstoc
					                                                                                                                                                                                                                                                                Page 1 of 2
10/September/2009 10:08 - 10/September/2009




                                                       Simple selectors                            Combinators                    &
                                                                                                                                  &       negation             Attribute selectors                         Structural pseudo-classes
                                              assume throughout that E and F are                  descendant combinator to style an F                  element E with a "foo" attribute                    n can be replaced with an expression in all
                                              elements, they can have attribute fo o e.g.         element, which is a descendant of an E               E[foo]                                              following cases n can be (odd), (even) or
                                              <e fo o= " ba r" > you can replace these            element                                                                                                  expressions such as (3n + 1)
                                                                                                                                                       E’s attribute f o o , value exactly equal to ba r
                                              with any elements or attributes.                    E F                                                                                                      an E element, the n-th child of its parent
                                                                                                                                                       E[foo="bar"]
                                              In HTML, elements in CSS can be uppercase           child combinator an F element which is the
                                              like these examples. In XHTML, elements                                                                  E’s attribute f o o , value is whitespace-          E:nth-child(n)
                                                                                                  direct child of an E element
                                              must be lower case. Classes and IDs are             E > F                                                separated values, one of which is exactly           an E element, the n-th child of its parent,
                                              always case sensitive                                                                                    "bar"                                               counting from the last one
                                                                                                  adjacent sibling combinator an F element             E[foo~="bar"]
                                              universal selector, match any element                                                                                                                        E:nth-last-child(n)
                                                                                                  that is immediately preceded by an E element
                                              *                                                                                                        E’s attribute f o o , value begins exactly "bar"    an E element, the n-th sibling of its type
                                                                                                  E + F
                                              type (or element) selector                                                                               E[foo^="bar"]                                       E:nth-of-type(n)
                                                                                                  general sibling combinator an F element
                                              E                                                   preceded at some point by an E element               E’s attribute f o o , value ends exactly "bar"      an E element, the n-th sibling of its type,
                                              ID selector an E element with ID equal to           E ~ F                                                E[foo$="bar"]                                       counting from the last one
                                              "myid", e.g. <e i d = " my i d" >                                                                                                                            E:nth-last-of-type(n)
                                                                                                  negation pseudo-class an E element that              E’s attribute f o o , value contains substring
                                              E#myid                                              does not match simple selector s                     "bar"                                               an E element that is the document root, i.e.
                                              class selector an E element whose class is          E:not(s)                                             E[foo*="bar"]                                       html
                                              "myclass", e.g. < e c l a s s = "m y c la s s " >                                                                                                            E:root
                                                                                                                                                       E’s attribute f o o has a hyphen-separated list
                                              E.myclass                                                                                                of values beginning (from the left) with "en"




                                                                                                                                                                                                                                                                file:///Users/natalie/Sites/natbat/natbat-code/clientside/css/pocketbook/css.html?print
                                                                                                                                                       E[foo|="en"]
                                                                                                  http://www.w3.org/TR/css3-selectors/
                                                                                                                                                                                   E:lang(fr)
                                                                                                                                                                 an element of type E in language "fr"
                                                                                                                                           E::after                                                                                           E:empty
                                                                This book belongs to:                         generated content after an E element                                      E:target
                                                                                                                                                                                                             text nodes)
                                                                                                                                                       element E is the fragment in the referring URI
                                                                                                                                          E::before                                                          an E element that has no children (including
                                                                                                           generated content before an E element                                          E:focus                              E:only-of-type
                                                                                                                                                           with a keyboard
                                                                                                                        E::first-letter                                                                              an E element, only sibling of its type
                                                                                                                                                           the link or form control E when tabbed to
                                                                                                          the first formatted letter of an E element                                                                               E:only-child
                                                                                                                                                                                          E:hover
                                                                                                                              E::first-line                                                                          an E element, only child of its parent
                                                                                                                                                            mouse
                                                                                                            the first formatted line of an E element        any element E when hovered over with a                             E:last-of-type
                                                                                                                                          E:checked                                                                   an E element, last sibling of its type
                                                                                                                                                                                        E:active
dinky pocket book - CSS Selectors




                                                                                                    a user interface element E which is checked                          the link E has been activated                             E:last-child
                                                                                                                                         E:disabled                                                                  an E element, last child of its parent
                                                                                                                                                                                      E:visited
                                                         Selectors                                  a user interface element E which is disabled         the href target of the link E has been visited                     E:first-of-type
                                                                                                                                          E:enabled                                                                   an E element, first sibling of its type
                                                                                                                                                                                            E:link
                                                         CSS                                         a user interface element E which is enabled           visited, hovered over focused on or active
                                                                                                                                                           matches a link E when E is a link and not
                                                                                                                                                                                                                                 E:first-child
                                                                                                                                                                                                                     an E element, first child of its parent
                                                                                                             Pseudo-elements
                                                          dinky pocket book                                     Forms &                                          Pseudo-classes                             Structural pseudo-classes

				
DOCUMENT INFO
Shared By:
Stats:
views:51
posted:3/26/2010
language:English
pages:1