initial

The initial CSS keyword applies the initial value of a property to an element. It can be applied to any CSS property, including the CSS shorthand all.

On inherited properties, the initial value may be surprising. You should consider using the inherit, unset, or revert keywords instead.

Example

HTML

<p>
  <span>This text is red.</span>
  <em>This text is in the initial color (e.g., black).</em>
  <span>This is red again.</span>
</p>

CSS

p {
  color: red;
}
em {
  color: initial;
}

Specifications

Specification Status Comment
CSS Cascading and Inheritance Level 4
The definition of 'initial' in that specification.
Working Draft No changes from Level 3.
CSS Cascading and Inheritance Level 3
The definition of 'initial' in that specification.
Candidate Recommendation Defines what an initial value is.
CSS Values and Units Module Level 3
The definition of 'initial' in that specification.
Candidate Recommendation Defines the keyword.

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1.0 3.5 (1.9.1)-moz[1]
19.0 (19.0)
No support 15.0 1.2
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 1.0 1.0 (1.9.1)-moz[1]
19.0 (19.0)
No support No support (Yes)

[1] From Firefox 1.0 onward, increasing support for -moz-initial was added in each version, culminating with the support for quotes in Firefox 3.5 (Gecko 1.9.1). The last addition was support for the non-standard -moz-border-*-colors in Firefox 3.6 (Gecko 1.9.2). Support for the prefixed -moz-initial keyword has been removed as of Firefox 24 in favor of the unprefixed initial keyword.

See also

  • Use unset to set a property to its inherited value if it inherits, or to its initial value if not.
  • Use revert to reset a property to the value established by the user-agent stylesheet (or by user styles, if any exist).
  • Use inherit to make an element's property the same as its parent.

Document Tags and Contributors

 Last updated by: mfluehr,