Scribd
Upload
46 views2 pages

Css Selectors Cheat Sheet

This document is a cheat sheet for CSS selectors, outlining various types such as universal, type, class, ID, group, descendant, child, adjacent sibling, general sibling, attribute, pseudo-class, and pseudo-element selectors. Each selector type is described with its syntax and purpose. It serves as a quick reference for web developers to understand how to target HTML elements using CSS.

Uploaded by

christianmuwa42
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
46 views2 pages

Css Selectors Cheat Sheet

This document is a cheat sheet for CSS selectors, outlining various types such as universal, type, class, ID, group, descendant, child, adjacent sibling, general sibling, attribute, pseudo-class, and pseudo-element selectors. Each selector type is described with its syntax and purpose. It serves as a quick reference for web developers to understand how to target HTML elements using CSS.

Uploaded by

christianmuwa42
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

CSS Selectors Cheat Sheet

Universal Selector

* { } - Targets all elements

Type Selector

element { } - Targets all elements of a specific type (e.g., p, h1)

Class Selector

.className { } - Targets elements with a specific class

ID Selector

#idName { } - Targets a specific element with an ID

Group Selector

selector1, selector2 { } - Targets multiple selectors at once

Descendant Selector

ancestor descendant { } - Targets elements inside another element

Child Selector

parent > child { } - Targets direct children of an element

Adjacent Sibling Selector

element1 + element2 { } - Targets the element immediately after another


CSS Selectors Cheat Sheet

General Sibling Selector

element1 ~ element2 { } - Targets all siblings after a specified element

Attribute Selector

element[attribute] { } - Targets elements with a specific attribute

Pseudo-class Selector

element:pseudo-class { } - Targets elements in a specific state (e.g., :hover, :first-child)

Pseudo-element Selector

element::pseudo-element { } - Targets part of an element (e.g., ::before, ::after)

You might also like