Simple Selectors

Simple Selectors

These selectors target elements based on basic identifiers like name, id, or class.

Types:

🔸 Element Selector

Selects elements by tag name.

h1 {
  color: red;
}

🔸 ID Selector

Selects a unique element with a specific id.

#header {
  background-color: black;
}

👉 Note: ID must be unique in a page.

🔸 Class Selector

Selects elements with a specific class.

.box {
  border: 1px solid gray;
}

👉 Multiple elements can share the same class.

🔸 Universal Selector

Selects all elements.

* {
  margin: 0;
  padding: 0;
}

🔸 Group Selector

Apply same style to multiple elements.

h1, p, div {
  color: green;
}