Selectors define to which elements a set of CSS rules apply.
When a URL points at a specific piece of a document, it can be difficult to ascertain. Find out how you can use some simple CSS to draw attention to the target of a URL and improve the user's experience.
This is referred to as an adjacent selector or next-sibling selector. It will select only the specified element that immediately follows the former specified element.
In an HTML document, CSS class selectors match an element based on the contents of the element's class attribute. The class attribute is defined as a space-separated list of items, and one of those items must match exactly the class name given in the selector.
In an HTML document, CSS ID selectors match an element based on the contents of that element's id attribute, which must match exactly the value given in the selector.
A CSS pseudo-class is a keyword added to selectors that specifies a special state of the element to be selected. For example :hover will apply a style when the user hovers over the element specified by the selector.
Returns a list of the elements within the document (using depth-first pre-order traversal of the document's nodes) that match the specified group of selectors. The object returned is a NodeList.
Attribute selectors select an element using the presence of a given attribute or attribute value.
The > combinator separates two selectors and matches only those elements matched by the second selector that are direct children of elements matched by the first. By contrast, when two selectors are combined with the descendant selector, the combined selector expression matches those elements matched by the second selector for which there exists an ancestor element matched by the first selector, regardless of the number of "hops" up the DOM.
The ~ combinator separates two selectors and matches the second element only if it is preceded by the first, and both share a common parent.
Just like pseudo-classes, pseudo-elements are added to selectors but instead of describing a special state, they allow you to style certain parts of a document. For example, the ::first-line pseudo-element targets only  the first line of an element specified by the selector.
CSS type selectors match elements by node name. Used alone, therefore, a type selector for a particular node name selects all elements of that type — that is, with that node name — in the document.
An asterisk (*) is the universal selector for CSS. It matches a single element of any type. Omitting the asterisk with simple selectors has the same effect. For instance, *.warning and .warning are considered equal.
Returns the first element within the document (using depth-first pre-order traversal of the document's nodes|by first element in document markup and iterating through sequential nodes by order of amount of child nodes) that matches the specified group of selectors.
Returns the first element that is a descendant of the element on which it is invoked that matches the specified group of selectors.