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.

Note: On inherited properties, the initial value may be unexpected. 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 (typically 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 Initial definition.

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,