What are pseudo classes and pseudo elements?
Examples of pseudo classes:
a:hover { color: red; }
Examples of pseudo elements:
div::before { Content: 'Old driver'; }
Conclusion:
Common pseudo classes:
: When the active element is active : when the focus element has gained focus : when hover element is suspended : linkWhen the link is not visited : visited link has been visited : When the first child element is the first child element : When the last child element is the last child element : nth child() element is the nth child element : nth last child () element is the nth last child element : when the only child element is the only child element : when the first of type element is a child element of the first specific type : When the last of type element is a child element of the last specific type : nth-of-type() element is the nth child element of a specific type : nth last of type () element is the nth child element of a specific type : when the only of type element is the only child element of a specific type : not When the specified conditions are not met : when the target element id matches the hash value : When the root element is the root element of the document tree When: lang() matches the specified language : empty When the element is in the state without child elements Whether: invalid and: valid form items are valid Whether: required and: optional form items are required Whether: in range and: out of range form items are out of range : read-only and: read-write form items are read-only Whether the: enabled and: disabled form items are disabled
Common pseudo elements:
:: first letter Select the first letter in the block element :: first line Select the first line :: before Create an element not in the document tree before :: after creates an element that is not in the document tree after :: placeholder The placeholder text of the selected form element :: file selector button Select the button in the input of type file