混淆後代選擇器和交集選擇器所導致的錯誤

2022-04-23 15:01:41 字數 1224 閱讀 1334

1.交集選擇器

交集復合選擇器是由兩個選擇器直接連線而成,第乙個選擇器必須為標記選擇器,第二個選擇器必須為類別選擇器或者是id選擇器,兩個選擇器之間不能有空格,必須連續書寫。

2.並集選擇器

並集選擇器,也可以說是集體宣告。他的結果是同事選中各個基本選擇器所選擇的範圍,任何形式的選擇器(包括標記選擇器/class 選擇器/id選擇器等)都可以作為並集選擇器的一部分。並集選擇器是由多個選擇器通過都好連線而成的,在宣告各種css選擇器時,如果某些選擇器的風格是相同的,或者部分相同,就可以利用並集選擇器宣告風格相同的css選擇器

3.後代選擇器

後代選擇器適用於對於特殊位置的html金星宣告。例如當<.p>之間包含標記時,就可以使用貨代選擇器進行相應的控制。後代選擇器的方法是爸外層選擇器解除安裝前面,內層標記解除安裝後面,之間用空格分隔2.當標記發生巢狀時,內層的標記就成為外形標記的後代。

ps:後代元素不僅限於元素的直接後代,而且會影響到各級後代。因此在css2中,規範的定義者還規定了一種復合選擇器,成為」子選擇器「,也就是只對直接後代有影響的選擇器,而對孫子以及多個層的後代沒有影響。

子選擇器和後代選擇器的語法區別是使用大於號連線,例如 p>span

下面的乙個例子是我在寫乙個網頁的時候由於混淆所導致的錯誤:

我在#skin_5和.selected之間多加了個空格形成了後代選擇器,然後導致他即使被賦予了selected屬性,他的background-position屬性值依然沒變。

改為用交集選擇器,去掉其中的空格則達到了想要的結果。

造成上面問題的原因是,我後代選擇器用多了,忽視了他們之間的同級關係。

後代選擇器和子選擇器

後代選擇器 h1 em 選擇器可以解釋為 作為 h1 元素後代的任何 em 元素 有關後代選擇器有乙個易被忽視的方面,即兩個元素之間的層次間隔可以是無限的。例如,如果寫作 ul em,這個語法就會選擇從 ul 元素繼承的所有 em 元素,而不論 em 的巢狀層次多深。div01 ul li div0...

《選擇器》 四 子代選擇器和後代選擇器

1 doctype html 2 html lang cn 3 head 4 meta charset utf 8 5 title title title 6head 7 body 8 div id father 9 div class red 1 div 10 div 211 p 21 p 12 ...

後代選擇器

後代選擇器 找到指定標籤的所有特定的後代標籤,設定屬性。1.什麼是後代選擇器?作用 找到指定標籤的所有特定的後代標籤,設定屬性 格式 標籤名稱1 標籤名稱2 先找到所有名稱叫做 標籤名稱1 的標籤,然後再在這個標籤下面去查詢所有名稱叫做 標籤名稱2 的標籤,然後在設定屬性 div p 注意點 1.後...