翻譯不完整。請協助 翻譯此英文文件

選擇器定義給元素一個 CSS 樣式集合。

基本選擇器

標籤選擇器
這個基本的選擇器會選擇所有元素,這些元素都符合給訂名字。
語法: eltname
範例: input 會比對任一個 <input> 元素。
類別選擇器
這個基本的選擇器會選擇所有基於 class 屬性值的元素。
語法: .classname
範例: .index 會比對任一元素含有 index 類別(可以定義成 class="index" 或其他類似的定義)。
ID 選擇器
這個基本的選擇器會選擇基於 id 屬性的節點。在文件裡,應該只可以將一個 ID 給一個元素。
語法: #idname
範例: #toc 會比對含有 ID 是 toc 的元素(可以定義成 id="toc" 或其他類似的定義)。
Universal selectors
This basic selector chooses all nodes. It also exists in a one-namespace only and in an all-namespace variant too.
Syntax: * ns|* *|*
Example: * will match all the elements of the document.
Attribute selectors
This basic selector chooses nodes based on the value of one of its attributes.
Syntax: [attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value]
Example: [autoplay] will match all the elements that have the autoplay attribute set (to any value).

Combinators

Adjacent sibling selectors
The '+' combinator selects nodes that immediately follow the former specified element.
Syntax: A + B
Example: ul + li will match any <li> that immediately follows a <ul>.
General sibling selectors
The '~' combinator selects nodes that follow (not necessarily immediately) the former specified element, if both elements shared the same parent.
Syntax: A ~ B
Example: p ~ span will match all <span> elements that follow a <p> element inside the same element.
Child selectors
The '>' combinator selects nodes that are direct children of the former specified element.
Syntax: A > B
Example: ul > li will match all <li> elements that are inside a <ul> element.
Descendant selectors
The ' ' combinator selects nodes that are children (not necessary direct children) of the former specified element.
Syntax: A B
Example: div span will match any <span> element that is inside a <div> element.

Pseudo-elements

Pseudo-elements are abstractions of the tree representing entities beyond what HTML does. For example, HTML doesn't have an element describing the first letter or line of a paragraph, or the marker of a list. Pseudo-elements represent these entities and allow CSS rules to be associated with them. that way, these entitities can be styled independently.

Pseudo-classes

Pseudo-classes allow to select elements based on information that is not contained in the document tree like a state or that is particularly complex to extract. E.g. they match if a link has been previously visited or not.

規範

Specification Status Comment
Selectors Level 4 Working Draft  
Selectors Level 3 Recommendation  
CSS Level 2 (Revision 1) Recommendation  
CSS Level 1 Recommendation Initial definition

瀏覽器相容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 1 1.0 (1.7 or earlier) 3.0 3.5 1.0
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 1.5 1.0 (1.9.2) ? ? 3.2

文件標籤與貢獻者

 此頁面的貢獻者: jsgao0, jackblackevo
 最近更新: jsgao0,