The :out-of-range pseudo-class styles the elements that have range limitations when the value of the element is outside the specified range. Version Selectors Level 4 Syntax Example of the :out-of-range selector:

The :optional selector selects optional elements. Form elements are optional when attribute is not required. Form elements that can be selected using :optional are <input>, <select> and <textarea> without a required attribute. The :optional selector can be linked with other selectors (e.g. :hover) and with pseudo-elements (e.g. ::after). Version CSS Basic User Interface Module CSS2 Universal Selector Syntax Example of the :optional selector: In the given example both the :optional and…

The :only-of-type selector matches elements that are the only child of its type. The p:only-of-type matches a paragraph only if it is the only paragraph inside its parent. The :only-of-type and the :only-child selectors have similarities, except that the :only-child selector selects the element if its parent has no other children of any type. Version Selectors Level 3 Selectors Level 4 Syntax Example of the…

The :only-child pseudo-selector matches an element if it is the only child of its parent. The element is selected only if its parent has no other children of any type. The :only-child pseudo-class is the same as :first-child, :last-child or :nth-child(), :nth-last-child(), but with a lower specificity. Version Selectors Level 4 Selectors Level 3 Syntax Example of the :only-child selector: Example of…

The :nth-of-type() pseudo-class selects the elements of the same type based on their index. The :nth-of-type() can be specified by a number, a keyword, or a formula. The :nth-of-type selector is similar to :nth-child but there is a difference: it is more specific. The :nth-of-type targets a certain type of an element in the arrangement only in relation to similar siblings.…

The :nth-last-of-type() pseudo-class selects elements based on their index starting from the last element upwards. The:nth-last-of-type() can be specified by a number, a keyword, or a formula. The :nth-last-of-type() pseudo-class is similar to :nth-of-type() but there is a difference: it counts the items from the end whereas the nth-of-type counts them from the beginning. This pseudo-class is also similar to :nth-last-child with…

The :nth-last-child() pseudo-class selects elements based on their index starting from the last element upwards. The :nth-last-child() can be specified by a number, a keyword, or a formula. Keyword values odd Selects elements with odd index numbers (e.g 1, 3, 5, 7 etc.). even Selects elements with even index numbers (e.g 2, 4, 6, 8 etc.). Functional notation <An+B>…

The :nth-child() pseudo-class selects and adds styles to elements based on their index. The :nth-child() can be specified by a number, a keyword, or a formula. Keyword values odd Represents those elements whose numeric position is odd (e.g 1, 3, 5, 7 etc.). even Represents those elements whose numeric position is even (e.g 2, 4, 6, 8 etc.). Functional…

The :not() pseudo-class represents elements that do not match a list of selectors. It is also known as the negation pseudo-class. It is a functional pseudo-class selector that takes a simple selector as an argument and matches with one or more elements not being represented by the argument. The :not() selector takes as an argument any of…

The :link pseudo-class is used to select and style unvisited links in a page. It applies to links that have not yet been visited. An element can be both :visited and :active so as the :link pseudo-class will have an effect. :active, :hover, or :visited pseudo-classes override the style defined by the :link pseudo-class. For styling links properly, the :link rule should be placed before all other link-related…