CSS Selectors Reference (MDN) - Free Download
Reference of CSS selectors from MDN Web Docs, including syntax and grouping information for all standard CSS selectors. Contains 144 records. Download in Excel, CSV, PDF formats.
📥 Free Download
💡 Key Takeaways
- Contains 144 records / 3 fields
- Available for free download in Excel, CSV, and PDF formats
- Data sourced from: https://github.com/mdn/data
📋 ข้อมูลทั้งหมด
Showing 144
of 144
| Selector | Syntax | Groups |
|---|---|---|
| Type selectors | element | Selectors |
| Class selectors | .class | Selectors |
| ID selectors | #id | Selectors |
| Universal selectors | * | Selectors |
| Attribute selectors | [attr=value] | Selectors |
| Nesting selector | A { &B { } } | CSS Nesting |
| Selector list | , | Selectors |
| Next-sibling combinator | A + B | Selectors |
| Subsequent-sibling combinator | A ~ B | Selectors |
| Child combinator | A > B | Selectors |
| Descendant combinator | A B | Selectors |
| Column combinator | A || B | Selectors |
| Namespace separator | A | B | CSS Namespaces |
| Pseudo-classes | : | Selectors |
| Pseudo-elements | :: | Selectors |
| :active | :active | Selectors |
| :active-view-transition | :active-view-transition | CSS View Transitions |
| :active-view-transition-type() | :active-view-transition-type( <custom-ident># ) | CSS View Transitions |
| :any-link | :any-link | Selectors |
| :autofill | :autofill | Selectors |
| :blank | :blank | CSS Paged Media |
| :buffering | :buffering | Selectors |
| :checked | :checked | Selectors |
| :current | :current | Selectors |
| :default | :default | Selectors |
| :defined | :defined | Selectors |
| :dir() | :dir( [ ltr | rtl ] ) | Selectors |
| :disabled | :disabled | Selectors |
| :empty | :empty | Selectors |
| :enabled | :enabled | Selectors |
| :first | :first | CSS Paged Media |
| :first-child | :first-child | Selectors |
| :first-of-type | :first-of-type | Selectors |
| :focus | :focus | Selectors |
| :focus-visible | :focus-visible | Selectors |
| :focus-within | :focus-within | Selectors |
| :fullscreen | :fullscreen | Selectors, Fullscreen API |
| :future | :future | Selectors |
| :has() | :has( <forgiving-relative-selector-list> ) | Selectors |
| :has-slotted | :has-slotted | CSS Scoping |
| :host | :host | CSS Scoping |
| :host() | :host( <compound-selector> ) | CSS Scoping |
| :host-context() | :host-context( <compound-selector> ) | CSS Scoping |
| :hover | :hover | Selectors |
| :in-range | :in-range | Selectors |
| :indeterminate | :indeterminate | Selectors |
| :invalid | :invalid | Selectors |
| :is() | :is( <forgiving-selector-list> ) | Selectors |
| :lang() | :lang( <language-code> ) | Selectors |
| :last-child | :last-child | Selectors |
| :last-of-type | :last-of-type | Selectors |
| :left | :left | CSS Paged Media |
| :link | :link | Selectors |
| :local-link | :local-link | Selectors |
| :modal | :modal | Selectors |
| :muted | :muted | Selectors |
| :not() | :not( <complex-selector-list> ) | Selectors |
| :nth-child() | :nth-child( <an+b> [ of <complex-selector-list> ]? ) | Selectors |
| :nth-last-child() | :nth-last-child( <an+b> [ of <complex-selector-list> ]? ) | Selectors |
| :nth-last-of-type() | :nth-last-of-type( <an+b> ) | Selectors |
| :nth-of-type() | :nth-of-type( <an+b> ) | Selectors |
| :only-child | :only-child | Selectors |
| :only-of-type | :only-of-type | Selectors |
| :open | :open | Selectors |
| :optional | :optional | Selectors |
| :out-of-range | :out-of-range | Selectors |
| :past | :past | Selectors |
| :paused | :paused | Selectors |
| :picture-in-picture | :picture-in-picture | Selectors |
| :placeholder-shown | :placeholder-shown | Selectors |
| :playing | :playing | Selectors |
| :popover-open | :popover-open | Selectors |
| :read-only | :read-only | Selectors |
| :read-write | :read-write | Selectors |
| :required | :required | Selectors |
| :right | :right | CSS Paged Media |
| :root | :root | Selectors |
| :scope | :scope | Selectors |
| :seeking | :seeking | Selectors |
| :stalled | :stalled | Selectors |
| :state() | :state( <custom-ident> ) | Selectors |
| :target | :target | Selectors |
| :target-current | :target-current | CSS Overflow |
| :target-within | :target-within | Selectors |
| :user-invalid | :user-invalid | Selectors |
| :user-valid | :user-valid | Selectors |
| :valid | :valid | Selectors |
| :visited | :visited | Selectors |
| :volume-locked | :volume-locked | Selectors |
| :where() | :where( <complex-selector-list> ) | Selectors |
| :xr-overlay | :xr-overlay | WebXR DOM Overlays |
| ::-ms-browse | ::-ms-browse | Microsoft Extensions |
| ::-ms-check | ::-ms-check | Microsoft Extensions |
| ::-ms-clear | ::-ms-clear | Microsoft Extensions |
| ::-ms-expand | ::-ms-expand | Microsoft Extensions |
| ::-ms-fill | ::-ms-fill | Microsoft Extensions |
| ::-ms-fill-lower | ::-ms-fill-lower | Microsoft Extensions |
| ::-ms-fill-upper | ::-ms-fill-upper | Microsoft Extensions |
| ::-ms-reveal | ::-ms-reveal | Microsoft Extensions |
| ::-ms-thumb | ::-ms-thumb | Microsoft Extensions |
| ::-ms-ticks-after | ::-ms-ticks-after | Microsoft Extensions |
| ::-ms-ticks-before | ::-ms-ticks-before | Microsoft Extensions |
| ::-ms-tooltip | ::-ms-tooltip | Microsoft Extensions |
| ::-ms-track | ::-ms-track | Microsoft Extensions |
| ::-ms-value | ::-ms-value | Microsoft Extensions |
| ::-moz-progress-bar | ::-moz-progress-bar | Mozilla Extensions |
| ::-moz-range-progress | ::-moz-range-progress | Mozilla Extensions |
| ::-moz-range-thumb | ::-moz-range-thumb | Mozilla Extensions |
| ::-moz-range-track | ::-moz-range-track | Mozilla Extensions |
| ::-webkit-progress-bar | ::-webkit-progress-bar | WebKit Extensions |
| ::-webkit-progress-inner-value | ::-webkit-progress-inner-value | WebKit Extensions |
| ::-webkit-progress-value | ::-webkit-progress-value | WebKit Extensions |
| ::-webkit-slider-runnable-track | ::-webkit-slider-runnable-track | WebKit Extensions |
| ::-webkit-slider-thumb | ::-webkit-slider-thumb | WebKit Extensions |
| ::after | ::after | CSS Pseudo-Elements |
| ::backdrop | ::backdrop | CSS Pseudo-Elements |
| ::before | ::before | CSS Pseudo-Elements |
| ::checkmark | ::checkmark | CSS Form Control Styling |
| ::cue | ::cue | WebVTT |
| ::cue() | ::cue( <selector> ) | WebVTT |
| ::cue-region | ::cue-region | WebVTT |
| ::cue-region() | ::cue-region( <selector> ) | WebVTT |
| ::details-content | ::details-content | CSS Pseudo-Elements |
| ::file-selector-button | ::file-selector-button | CSS Pseudo-Elements |
| ::first-letter | ::first-letter | CSS Pseudo-Elements |
| ::first-line | ::first-line | CSS Pseudo-Elements |
| ::grammar-error | ::grammar-error | CSS Pseudo-Elements |
| ::highlight() | ::highlight( <custom-ident> ) | CSS Pseudo-Elements, CSS Custom Highlight API |
| ::marker | ::marker | CSS Pseudo-Elements, CSS Lists and Counters |
| ::part() | ::part( <ident>+ ) | CSS Shadow Parts |
| ::picker-icon | ::picker-icon | CSS Form Control Styling |
| ::picker() | ::picker( <form-control-identifier>+ ) | CSS Form Control Styling |
| ::placeholder | ::placeholder | CSS Pseudo-Elements |
| ::scroll-marker | ::scroll-marker | CSS Overflow |
| ::scroll-marker-group | ::scroll-marker-group | CSS Overflow |
| ::selection | ::selection | CSS Pseudo-Elements |
| ::slotted() | ::slotted( <compound-selector> ) | CSS Scoping |
| ::spelling-error | ::spelling-error | CSS Pseudo-Elements |
| ::target-text | ::target-text | CSS Pseudo-Elements |
| ::view-transition | ::view-transition | CSS View Transitions |
| ::view-transition-group() | ::view-transition-group([ '*' | <custom-ident> ]) | CSS View Transitions |
| ::view-transition-image-pair() | ::view-transition-image-pair([ '*' | <custom-ident> ]) | CSS View Transitions |
| ::view-transition-new() | ::view-transition-new([ '*' | <custom-ident> ]) | CSS View Transitions |
| ::view-transition-old() | ::view-transition-old([ '*' | <custom-ident> ]) | CSS View Transitions |