CSS Selectors – Advanced
5 Topics
Attribute Selectors
7 Sub-topics
Attribute Selectors Introduction
Exact Attribute Match [attr="value"]
Attribute Contains Word [attr~="value"]
Attribute Starts With [attr^="value"]
Attribute Ends With [attr$="value"]
Attribute Contains Substring [attr*="value"]
Attribute Selector Case Sensitivity
Pseudo-Classes – Part 1
8 Sub-topics
Pseudo-Classes Introduction
Link Pseudo-Classes (:link, :visited)
User Action Pseudo-Classes (:hover, :active, :focus)
:focus-within and :focus-visible
Structural Pseudo-Classes Overview
:first-child and :last-child
:nth-child() Selector Deep Dive
:nth-last-child() Selector
Pseudo-Classes – Part 2
7 Sub-topics
:nth-of-type() and :nth-last-of-type()
:first-of-type and :last-of-type
:only-child and :only-of-type
:not() Negation Pseudo-Class
:is() and :where() Selectors
:has() Parent Selector (CSS4)
Form Pseudo-Classes
9 Sub-topics
Form Pseudo-Classes (:enabled, :disabled)
Form Pseudo-Classes (:checked, :indeterminate)
Form Pseudo-Classes (:valid, :invalid)
Form Pseudo-Classes (:required, :optional)
Form Pseudo-Classes (:in-range, :out-of-range)
Form Pseudo-Classes (:placeholder-shown)
Pseudo-Elements
9 Sub-topics
Pseudo-Elements Introduction
::first-letter Pseudo-Element
::first-line Pseudo-Element
::selection Pseudo-Element
::placeholder Pseudo-Element
Combining Pseudo-Classes and Pseudo-Elements