1、後代選擇器(包括兒子和孫子)
.c1 .c2
2、子代選擇器(只選擇兒子)
.c3 > .c5
3、與選擇器
選擇p標籤下面的.c1的標籤:
p.c1
4、或選擇器(同時選擇)
p.c1,#i1
5、兄弟選擇器
(1)相鄰兄弟選擇器
相鄰兄弟選擇器用於匹配某個元素之後緊鄰的另乙個元素,這兩個元素擁有同乙個父級元素並且不存在巢狀關係。相鄰兄弟選擇器的定義需要用到加號+
,加號兩邊為相鄰的兩個元素,選擇器會匹配加號後面的元素。
h1 + p
(2)通用兄弟選擇器
通用兄弟選擇器與相鄰兄弟選擇器非常相似,但卻沒有那麼嚴格。通用兄弟選擇器同樣會匹配同一父級元素下的兄弟元素,但兄弟元素之間無需緊鄰。定義通用兄弟選擇器需要用到波浪號~
,波浪號兩邊為同一父級元素下的兩個元素,選擇器會匹配波浪號後面的元素。
h1 ∼ p
CSS組合選擇器全
在 css3 中包含了四種組合方式 後代選取器 以空格分隔 子元素選擇器 以大於號分隔 相鄰兄弟選擇器 以加號分隔 普通兄弟選擇器 以波浪號分隔 後代選擇器所謂後代,就是乙個元素包含在另乙個元素裡面,例如 這裡p就是div的後代 後代選擇器匹配所有指定元素的後代元素。div p選取所有在div裡面的...
5 CSS組合選擇器
組合選擇器 把基本選擇器通過特殊符號串在一起,串起來之後能帶來一些特定的意義。組合選擇器中主要需要掌握的有4個 1 分組選擇器 格式 選擇器1,選擇器2,選擇器3 意義 使用 將多個基本選擇器連在一起,表示 這些選擇器 所對應的元素 都使用這個宣告中的樣式。2 巢狀選擇器 格式 選擇器1 選擇器2 ...
css選擇器 CSS選擇器總結
在前不久的專案中,實習小妹妹在乙個全域性的樣式中使用了下面這個css選擇器 content 對應的html結構大致是 實習妹子大致的意思是想要讓content下的子元素div的高度100 但是貌似她沒有真正理解first child的意義,從而導致這個全域性的樣式讓 所有頁面都出現了問題,然後我就只...