css上下文選擇器有四種類型:1、後代選擇器,可選擇當前元素的所有後代元素;2、父子選擇器,可選擇當前元素的所有子元素;3、同級相鄰選擇器,可選擇擁有共同父級且相鄰的元素;4、同級所有選擇器,可選擇擁有共同父級的後續所有元素。
本教學操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。
上下文選擇器就是構成了"父子"或層級關係的一組元素,透過他們的關係設定樣式
html 文件,看起來就像一顆倒置的」樹」,所以是有層級結構的
每一個元素, 在文件中, 都有自己的位置,即上下文關係
所以, 完全可以根據元素的上下文關係,來獲取到它們
一個元素的四個角色
序號 | 角色 | ##描述|
---|---|---|
##1 | 祖先元素 | 擁有子元素,孫元素等所有層級的後代元素 |
2 | 父級元素 | 只擁有子元素層級的元素 |
#3 | 後代元素 | 與其它層級元素一起擁有共同祖先元素 |
4 | 子元素 | #與其它同級元素一起擁有共同父級元素 |
#四個上下文選擇器
#序號 | 選擇器 | 運算符 | 描述 | 範例 |
---|---|---|---|---|
#1 | 後位選擇器 |
#空格 |
選擇目前元素的所有後代元素 |
div p, body * |
##2 | 父子選擇器 |
> | #選擇目前元素的所有子元素 |
|
3 | 同級相鄰選擇器 |
選擇擁有共同父級且相鄰的元素 |
||
4 | 同級所有選擇器 |
~ | 選擇擁有共同父級的後續所有元素 |
##範例 css影片教學###)###
以上是css上下文選擇器的類型有什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!