How do you set styles for all elements on a page?

CSSJunior~1 min read

To set styles for all elements on a page, the universal selector * is used. It selects absolutely every HTML element.

Example

css

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

In this example, the rule applies to all elements without exception.

Features of the universal selector

covers all elements: tags, pseudo-elements (::before, ::after), and nested nodes
useful for global rules (for example, resets and shared base settings)
but too many styles should not be applied to it, so as not to slow down rendering or lose flexibility in controlling elements

Alternative approach

Sometimes global rules are set on html and body, when the effect needs to reach the whole page but not every single element:

css

html, body {
  font-family: Arial, sans-serif;
  background: #fff;
}

Summary: if you truly need to apply a style to all elements, use the universal selector *. If you need an almost global effect but without total coverage, style html and body.

Short Answer

Interview ready

Premium

A concise answer to help you respond confidently on this topic during an interview.

How do you set styles for all elements on a page?

#Example

#Features of the universal selector

#Alternative approach

Short Answer

Example

Features of the universal selector

Alternative approach