Selector - Pseudo Class

Chrome Devtool Selector

About

A pseudo-class is a keyword added to operator that specifies a special state of the element to be selected.

Example

nth

The second h2 element: 

h2:nth-of-type(2)

Since selector - 3 nth-of-type pseudo class

Documentation / Reference




Discover More
Force Element State
Action Pseudo-class (:hover, :active, :focus, :visited) - Element state

Action pseudo class :hover will apply a style when the user hovers over the element specified by the selector. In the browser developer tool, you can change the state of an element to test it....
CSS - Addessing model (through selector and properties)

CSS addressing model. Selectors and properties allow style sheets to refer to the following parts of a document or user agent: Elements in the document tree and certain relationships between them (???)...
CSS - Transitions

in CSS. Transition properties create smooth transitions (using timing functions) between different values property of two different element state. The transition short property is where: transition-durationtransition-duration:...
HTML - Checked

checked is an HTML attribute that indicates via its value (true or false - default to true) if the form control element is checked. It's used: in a checkbox or radio button select optionselected...
Chrome Devtool Selector
How can I define the actual / context element in a CSS selector ? Short Answer: the scope pseudo-class

When chaining selection with the querySelector, you may need to perform selection in the context of the actual selected node. This article shows you how to do it. The short answer is that you need to...
Chrome Devtool Selector
How to select elements based on attribute ? (with the css selector API)

This page is selector expressions that select elements based on attribute. An ID selector and a class selector (ie selects element with ID “IdName” and the class “className”) The HTML...
Chrome Devtool Selector
Selector - Logical Pseudo-Class

Logical Pseudo-class are: :matches :not :has :is that return a boolean value (ie logical). They are predicate expression. Example of a selector when the element has the class fade but not...
Chrome Devtool Selector
Selector - Tree Selectors (Pseudo Class)

Tree Pseudo Class are pseudo class that permits to select element of the tree :root, :empty, :blank, …child, of-type
Chrome Devtool Selector
Selector API

API A selector is a boolean expression (known also as predicate) that match against elements in a DOM tree in order to select one or several node. This API was known before as the CSS and was renamed...
Chrome Devtool Selector
Selector- Pseudo-selector (Pseudo-element)

Pseudo-elements are element added to selectors to be able to select a sub-content of a content element. See . They will also add an element into the flow. pseudo-class TR/2011/REC-CSS2-20110607/selector.html:first-line...



Share this page:
Follow us:
Task Runner