The initial CSS keyword applies the initial value of a property to an element. It is allowed on every CSS property and causes the element for which it is specified to use the initial value of the property.

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

Examples

 /* give headers a green border */
 h2 { border: medium solid green }

 /* but make those in the sidebar use the value of the "color" property */
 #sidebar h2 { border-color: initial; }
 <p style="color:red"> 
    this text is red 
       <em style="color:initial"> 
          this text is in the initial color (e.g. black)
       </em>
    this is red again
 </p> 

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)
Not supported 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)
Not supported Not supported (Yes)

[1] From Firefox 1.0, increasing support for -moz-initial has been added in each version, culminating with its support for quotes since Firefox 3.5 (Gecko 1.9.1). The last bit was its 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 from Firefox 24 in favor of the unprefixed initial keyword.

See also

Document Tags and Contributors

 Last updated by: cvrebert,