Selectors

Grouping : When several selectors share the same declarations, they may be grouped into a comma-sepated list.

Universal Selector : The universal selector, written “* ”, matches the name of any element type. It matches any single element in the document tree. If the universal selector is not the only component of a simple selector, the * may be omitted.

Type selector : A type selector matches the name of a document language element type. A type selector matches every instance of the element type in the document tree. Example : the following rule matches all H1 elements in the document tree : H1 {font-family : serif}

Descendant selectors : At times, authors may want selectors to match an element that is descendant of another element in the document tree (e.g., "match those EM elements that are contained by an H1 element"). Descendant selectors express such a relationship in a pattern. A descendant selector is made up of two or more selectors separed by whitespace. A descendant selector of the form “A B” matches when an lement B is arbitrary descendant of the same ancestor element A. Note that descendant selectors can be merged with other selectors.

Child selectors : A child selector matches when an element is the child of some element. A child selector is made up of two selector separated by “>”. ote that child selectors can be merged with other selectors.

Adjacent sibling selectors : Adjacent sibling selectors have the following syntax : E1+E2, where E2 is the subject of the selector. The selector matches if E1 and E2 share the same parent in the tree and E1 immediately precedes E2. In some contexts, adjacent elements generate formatting objects whose presentation is handled automatically (e.g., collapsing margin between adjacent boxes). The + selector allows authors to specify additional style to adjacent elements.

Attribute selectors : CSS allows authors to specify rules that match attributes defined in the source document. Attribute selectors may match in four ways: [att] match when the element sets “att” attribute, whatever the value of the attribute. [att=val] match when the “att” attribute value is exactly “val”. [attr~=val] match when the element's att attribute is a space-eperated list of “words”, one of which is exactly “val”. If the selector is used, the words in the value must not contains spaces. [att|=val] match when attribute value is a hyphen-seperated list of “words”, beginning with “val”. The match always starts at the beginning of the attribute value. This is primarily intended to allow language susbcode matches as described in RFC 1766.

ID selectors : Document may contain attributes that are declared to be of type ID. What makes attributes of type ID special is that not two such attributes can have the same value; an ID attribute can be used to uniquely identify its element. CSS ID selectors match an element instance based on its identifier. A CSS ID selector contains a “#” immediately followed by the ID value.

:first-child pseudo class : The :first-child pseudo class matches an element that is first child of some other element. Examples : DIV > P:first-child {text-indent:0}; DIV:first-child H1 > P:first-child {color:green}.