### 組合選擇器 * 鄰近元素選擇器 ~~~ /*選中緊接在另一個元素后的元素,示例中，只有每個ul后面的第一個段落設置了樣式。*/ ul + p /*選中除了第一個li元素外的其它鄰近的li后面的兄弟元素*/ li + li { color: red;} <li>1</li><li>2</li><li>3</li> ~~~ * 兄弟選擇器 ~~~ /*選擇某一個指定元素后面的所有符號條件的兄弟節點*/ h1 ~ p{ color: red;} ~~~ * 條件選擇器 > `:lang`指定標記語言的`元素` > `:dir()`指定編寫方向的`元素` > `:has`包含指定元素的`元素` > `:is`指定條件的`元素` > `:not`非指定條件的`元素` > `:where`指定條件的`元素` > `:scope`指定`元素`作為參考點 > `:any-link`所有包含`href`的`鏈接元素` > `:local-link`所有包含`href`且屬于絕對地址的`鏈接元素` * 狀態選擇器 > `:active`鼠標激活的`元素` > `:hover`鼠標懸浮的`元素` > `:link`未訪問的`鏈接元素` > `:visited`已訪問的`鏈接元素` > `:target`當前錨點的`元素` > `:focus`輸入聚焦的`表單元素` > `:required`輸入必填的`表單元素` > `:valid`輸入合法的`表單元素` > `:invalid`輸入非法的`表單元素` > `:in-range`輸入范圍以內的`表單元素` > `:out-of-range`輸入范圍以外的`表單元素` > `:checked`選項選中的`表單元素` > `:optional`選項可選的`表單元素` > `:enabled`事件啟用的`表單元素` > `:disabled`事件禁用的`表單元素` > `:read-only`只讀的`表單元素` > `:read-write`可讀可寫的`表單元素` > `:target-within`內部錨點元素處于激活狀態的`元素` > `:focus-within`內部表單元素處于聚焦狀態的`元素` > `:focus-visible`輸入聚焦的`表單元素` > `:blank`輸入為空的`表單元素` > `:user-invalid`輸入合法的`表單元素` > `:indeterminate`選項未定的`表單元素` > `:placeholder-shown`占位顯示的`表單元素` > `:current()`瀏覽中的`元素` > `:past()`已瀏覽的`元素` > `:future()`未瀏覽的`元素` > `:playing`開始播放的`媒體元素` > `:paused`暫停播放的`媒體元素` * 結構選擇器 > `:root`文檔的`根元素` > `:empty`無子元素的`元素` > `:nth-child(n)`元素中指定順序索引的`元素` > `:nth-last-child(n)`元素中指定逆序索引的`元素` > `:first-child`元素中為首的`元素` > `:last-child`元素中為尾的`元素` > `:only-child`父元素僅有該元素的`元素` > `:nth-of-type(n)`標簽中指定順序索引的`標簽` > `:nth-last-of-type(n)`標簽中指定逆序索引的`標簽` > `:first-of-type`標簽中為首的`標簽` > `:last-of-type`標簽中為尾`標簽` > `:only-of-type`父元素僅有該標簽的`標簽` * 屬性選擇器 > `[attr]:`指定屬性的元素 > `[attr=val]:`屬性等于指定值的元素 > `[attr*=val]:`屬性包含指定值的元素 > `[attr^=val]:`屬性以指定值開頭的元素 > `[attr$=val]:`屬性以指定值結尾的元素 * 偽元素 > `::before`：在元素前插入內容； > `::after`：在元素后插入內容；