logo-final-curve-version-05_1600851593
Documents |

Introduction to CSS Selector

Table of Content

What is a selector?


A CSS selector is the first part of a CSS Rule. It tells which exact elements the specific rule should be applied to.

css-selector


Type, class, and ID selectors

This group includes selectors that target an HTML element such as an <h1>.

h1 { color: red; }

It also includes selectors which target a class:

.box{ color: red; }

or, an ID:

#unique { color: red; }


Attribute selectors

This group of selectors gives you different ways to select elements based on the presence of a certain attribute on an element:

a[title] { }
a[href="<https://example.com>"] { }


Pseudo-classes and pseudo-elements

This group of selectors includes pseudo-classes, which style certain states of an element. The :hover pseudo-class for example selects an element only when it is being hovered over by the mouse pointer:

a:hover { }


Combinators

The final group of selectors combines other selectors in order to target elements within our documents. The following for example selects paragraphs that are direct children of <article> elements using the child combinator (>):

article > p { }

css-selector-2

Share

DIscord chat

We're available Monday–Friday, security and critical bug fixes are available 24/7.

Facebook page

Get the latest news and updates regarding Nilead platform and services.