Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Other Selectors | Selectors and Cascade
Introduction to CSS Part I
course content

Course Content

Introduction to CSS Part I

Other Selectors

Element selector

This selector is used to select and style all elements of a particular type on the page. It is identified by the element type (e.g., p, div, h1, etc.).

This selector will select and style all p elements on the page, giving them a blue color.

html

index

css

index

js

index

Descendant selector

This selector is used to select and style elements that are descendants of a particular element. The ancestor element, a space, and the descendant element identify it.

This selector will select and style all p elements descendants of a div element, giving them a font size of 12px.

html

index

css

index

js

index

Child selector

This selector is used to select and style elements that are direct children of a particular element. It is identified by the parent element, followed by a > symbol, followed by the child element.

This selector will select and style all p elements that are direct children of a div element, giving them an italic font style.

html

index

css

index

js

index

Adjacent sibling selector

This selector is used to select and style elements that are siblings of a particular element and come immediately after it. It is identified by the first element, followed by a + symbol, followed by the second element.

html

index

css

index

js

index

General sibling selector

This selector is used to select and style elements that are siblings of a particular element and come after it. It is identified by the first element, followed by a ~ symbol, followed by the second element. For example:

This selector will select and style all p elements that are siblings of a div element and come after it, giving them a red color.

html

index

css

index

js

index

Attribute selector

This selector selects and styles elements based on their attribute values. It is identified by the element type, followed by an opening square bracket [, followed by the attribute name and value, and a closing square bracket ].

This selector will select and style all elements with an href attribute that starts with 'https', giving them an orange color.

html

index

css

index

js

index

Everything was clear?

Section 2. Chapter 3
We're sorry to hear that something went wrong. What happened?
some-alt