CSS選擇器類型

選擇器表示元素在樹結構中的特定模式。選擇器(selector)術語指的是，簡單選擇器(simple selector)，復合選擇器(compound selector)，復雜選擇器(complex selector)，或者選擇器列表(selector list)。選擇器的主題是任何被選擇器被定義的元素；即與該選擇器匹配的任何元素。

簡單選擇器是元素上的一個條件。 類型選擇器(class-selector)，通用選擇器(universal-selector)，屬性選擇器(attribute-selector)，類選擇器(type-selector)，ID選擇器(id-selector)，或者偽類(pseudo-class)都是簡單選擇器。當本說明書中定義的簡單選擇器根據文檔語言準確地描述了給定元素時，該給定元素被稱為與該簡單選擇器匹配。

復合選擇器是一個沒有被組合子分割的簡單選擇器組成的序列，表示一組條件同時選擇一個元素。如果符合選擇器包含類型選擇器或通用選擇器，這個選擇器必須在序列中第一個出現。在序列中只允許出現一個類型選擇器或通用選擇器。當元素符合復合選擇器中的所有簡單選擇器則該元素才匹配了這個復合選擇器。

注意：空白字符表示后端組合子，在復合選擇器中，簡單選擇器之間不允許有空格。

偽復合選擇器是偽類選擇器，之后可選的可以跟一個偽類選擇器，之前可選的可以加一個復合選擇器或者偽復合選擇器，但不能有任何組合子。當偽元素具有指定的偽元素名稱，與任何偽類所表示的額外條件匹配，并具有由相鄰的前一個選擇器表示的起源元素時，偽元素與偽復合選擇器匹配。如果沒有相鄰的前一個選擇器，則假定為通用選擇器。（例如，.foo ::before 等同于 .foo *::before，并且與 .foo::before 不同。）

例如，在.foo::before:hover中，.foo是復合選擇器，而::before:hover是偽復合選擇器。然而在.foo::before::marker中，::before和::marker是獨立的偽復合選擇器.

注意：偽復合選擇器不是復合選擇器，不能使用在明確說明只能使用復合選擇器的地方。偽復合選擇器的作用就好像它們自己攜帶了一個組合子，表達了它們與原始元素的關系，就像>組合子表達了與父元素的關系一樣。

組合子描述的是兩個元素之間的關系，這兩個元素由組合子兩邊的復合選擇器提供。在4級選擇器中組合子包括：后代組合子（空格），子組合子（U+003E, >），下一個兄弟組合子（U+002B, +），后繼同級組合子（U+007E, ~）。兩個給定元素之間的相關關系是真則表示這兩個元素匹配了這個組合子。

復雜選擇器是一個序列，這個序列由組合子分割的復合選擇器或偽復合選擇器或者復合選擇器和偽復合選擇器組成。復雜選擇器是作用于一組元素上的一組條件，這組條件通過組合子描述特定關系。當一個元素或偽元素匹配中了序列中最后的復合/偽復合選擇器，并且序列中通過組合子分割的其他選擇器單元也匹配中了各自的元素，那么就可以說這個元素匹配中了復雜選擇器。

例如，.foo.bar匹配一個有"foo"和"bar"類的元素。
'.ancestor > .foo.bar’匹配這些元素的子集: 這些元素的父元素有"ancestor"類。
'.foo.bar::before’匹配一個微元素，它的源元素是.foo.bar。

簡單/復合/復雜選擇器列表是一個逗號分割的簡單，復合，復雜選擇器列表。當類型不重要或在附近的文中指定時，也被稱為選擇器列表，如果了下很重要并且沒有被指定是，默認是復雜選擇器列表。

翻譯自：https://drafts.csswg.org/selectors-4/#structure

對規范的理解

復合選擇器

以上規范中復合選擇器比較存疑，因為規范中說的是選擇器列表，但是以逗號分割的，或者空格分割的都是列表，所以這里具體說明一下復合選擇器。
在規范中也說了復合選擇的作用是通過一組條件選擇同一個元素，并且其中不能有組合子。所以復合選擇器是div.abc這種形式，并且也明確說了如果有類型選擇器或者通用選擇器那么只能出現在復合選擇器的開頭。因為像div.abc這種形式，如果將div放在.abc后面又沒有組合子分割，那么其表達的含義和我們的目的顯然相去甚遠，.abcdiv表示的是選擇一個類名為abcdiv的元素，而不是一個有abc類的div元素。

偽復合選擇器

偽復合選擇器，我理解是偽元素的復合選擇器。復合選擇器是通過元素自身屬性的更加精確的描述來選擇元素。而偽復合選擇器則是通過偽元素自身屬性更加精確的描述來選擇偽元素。例如：div.abc說的是有一個div元素它還必須有abc類名。::before:hover說的是偽元素before必須被hover中才會被選中。所以復合選擇器的作用都是細化自身屬性來選擇某個元素。

復雜選擇器

和復合選擇器通過細化自身屬性來選擇元素不同，復雜選擇器是通過元素和元素之間的關系來選擇元素，而關系的表述是通過組合子完成的，分別是white space用于選擇后代，>用于選擇子代，+用于選擇下一個兄弟節點，~用于選擇后繼同級兄弟節點。例如：div .abc選擇的是div的后代具有abc類的元素。