css3選擇器 層次選擇器

2021-08-01 22:21:48 字數 377 閱讀 9439

層次選擇器:通過html的dom元素間的層次關係獲取元素,主要層次關係有 後代、父子、相鄰兄弟和通用兄弟。

1. 後代選擇器: e  f, 作用的是選擇元素的後代元素。包括子元素、孫輩元素等。(常用)

div div

2.子選擇器: e > f,作用的是某元素的所有子元素,不能包括孫輩元素(常用)

body > div

3.  相鄰兄弟選擇器: e + f, 選中的僅是乙個元素。同級並且f元素在e元素的後面。(很少用)

4. 通用兄弟選擇器: e ~ f,選中的可能是乙個元素或多個元素,選中的是與e元素相鄰的後面兄弟元素f及f之間的同級元素。(很少用)

css3 選擇器 CSS3選擇器

子級選擇器用於選取帶有特定父元素的元素。書寫語法 element1 element2 注意 如果 element2 元素不是父元素 element1 的直接子元素,則不會被選擇。符號之前書寫父級的選擇器,符號之後寫子級選擇器,必須滿足父子級關係才選中標籤 相鄰兄弟選擇器可以用於選擇緊接在另乙個元素後...

css3 選擇器 CSS3選擇器詳解

css3在css2基礎上,增強或新增了許多特性,彌補了css2的眾多不足之處,使得web開發變得更為高效和便捷。比如說,同樣是乙個頭像,可能在低版本的瀏覽器中,頭像方的 在高版本的瀏覽器中,頭像是圓的。漸進增強和優雅降級之間的不同 面試題目 由於css3普遍存在相容性問題,為了避免因相容性帶來的干擾...

CSS3選擇器 2 層次選擇器

12345 6 789 10關於層次選擇器,為了方便我們的陳述,建立了上面的文件,執行結果如下 1 後代選擇器 修改文件中的css樣式,在末尾新增如下內容 div div重新執行頁面 但凡乙個div的上層還是div元素的都被變成了橘紅色 2 子選擇器 在css樣式中新增 body div執行結果 我...