Suggest an edit

Improve this article

Refine the answer for “What is "inheritance" in CSS? Which properties are inherited by default?”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

**Inheritance in CSS** is a mechanism by which some properties are automatically **passed down to descendants from parent elements**.
If a parent sets, for example, a text color, child elements inherit that color unless something else is specified.

---

### **How it works**

Example:

```html
<div style="color: blue;">
  <p>Text inside a paragraph</p>
</div>
```

The `<p>` tag itself has no `color`, but it will **inherit** it from `<div>`, and the text will be blue.

---

### **Properties inherited by default**

Properties related mainly to **text and fonts** are inherited, for example:

- `color`, text color
- `font-family`, font
- `font-size`, font size
- `font-style`, `font-weight`, style and weight
- `line-height`, line spacing
- `text-align`, text alignment
- `visibility`, visibility
- `cursor`, cursor style
- `list-style`, list styling
- `letter-spacing`, `word-spacing`, spacing between letters and words

---

### **Non-inherited properties**

Most properties related to **sizes, spacing, borders, positioning, and background** are not inherited:

- `margin`, `padding`, `border`, `width`, `height`, `background`, and so on.

---

### **How to control inheritance**

CSS lets you control this explicitly using values:

- `inherit`, force inheritance
- `initial`, reset to the default value
- `unset`, inherit if the property is normally inherited; otherwise reset

Example:

```css
p {
  background-color: inherit;
}
```

In short: **inheritance** makes styling predictable and saves code, child elements automatically pick up some of their parents' visual properties, especially text-related ones.

Markdown · drag & drop images · ⌘B / ⌘I shortcuts229 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.