# 2.CSS3選擇器 - 新增的選擇器 1. 關係選擇器 E+F:下一個滿足條件的兄弟元素節點 E~F:與E元素同級的所有F元素節點 2. 屬性選擇器 E[attr~='val']:attr屬性中存在一個獨立的val值 E[attr|='val']:attr屬性中val開頭或val-開頭的 E[a ...
# 2.CSS3選擇器 - 新增的選擇器 1. 關係選擇器 E+F:下一個滿足條件的兄弟元素節點 E~F:與E元素同級的所有F元素節點 2. 屬性選擇器 E[attr~='val']:attr屬性中存在一個獨立的val值 E[attr|='val']:attr屬性中val開頭或val-開頭的 E[attr^='val']:attr屬性中val開頭 E[attr$='val']:attr屬性中val結尾 E[attr*='val']:attr屬性存在val值 3. 偽元素選擇器 //文本框中提示信息 E::placeholder{//只能設置下麵一個屬性 color:#ccc; } //選中後的效果 E::selection{//只能設置下麵三個屬性 color:#ccc; text-shadow:1px 2px black; } 4. 偽類選擇器:被選中元素的一種狀態 E:not(.demo) class!='demo'的E元素 :root 根標簽選擇器。在HTML里,選擇html節點 E:target 目標元素,多用於錨點
----下麵都要考慮其他同級元素,所以用的不多。是所有子元素 E:first-child 子元素中第一個元素且是E元素 E:last-child 子元素中最後一個元素且是E元素 E:only-child 子元素中只有一個元素且是E元素 E:nth-child(n) 子元素中第n個元素且是E元素 E:nth-last-child(n) 子元素中倒數第n個元素且是E元素 ----上面都要考慮其他同級元素,所以用的不多
----下麵不考慮其他同級元素,只考慮匹配的元素 E:first-of-type 子元素中第一個E元素 E:last-of-type 子元素中最後一個E元素 E:only-of-type 子元素中只有一個E元素 E:nth-of-type(n) 子元素中第n個E元素素 E:nth-of-last-type(n) 子元素中倒數第n個E元素 ----上面不考慮其他同級元素,只考慮匹配的元素
E:empty E元素中什麼節點都沒有(可以有註釋) E:checked 被選中的E元素 E:enabled 可以使用的E元素 E:disabled 帶有disabled屬性的E元素 E:read-only 帶有readonly屬性的E元素 E:read-write 帶有readwrite屬性的E元素 以上是markdown格式的筆記