이 문서는 아직 자원 봉사자들이 한국어로 번역하지 않았습니다. 참여해서 번역을 마치도록 도와 주세요!
English (US)의 문서도 읽어보세요.

The revert CSS keyword rolls back the cascade so that a property takes on the value it would have had if there were no styles in the current style origin (author, user, or user-agent). Thus, it resets the property to the default value established by the user-agent stylesheet (or by user styles, if any exist). It can be applied to any CSS property, including the CSS shorthand all.

The revert keyword is useful for isolating embedded widgets or components from the styles of the page that contains them, particularly when used with the all property.

In user stylesheets, revert rolls back the cascade and resets the property to the default value established by the user-agent stylesheet.

The revert keyword is different from and should not be confused with initial, which uses the initial value defined on a per-property basis by the CSS specifications. In contrast, user-agent stylesheets set default values on the basis of CSS selectors.

For example, the initial value for the display property is inline, whereas a normal user-agent stylesheet sets the default display value of <div>s to block, of <table>s to table, etc.

Example

HTML

<section>
  <p>This is a section!</p>

  <aside class="widget">
    <p>This is a little widget.</p>
  </aside>
</section>

CSS

section {
  color: blue;
  font-family: sans-serif;
  font-weight: bold;
}

.widget {
  all: revert;
}

Result

Specifications

Specification Status Comment
CSS Cascading and Inheritance Level 4
The definition of 'revert' in that specification.
Candidate Recommendation Initial definition.

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
Basic supportChrome No support No
Notes
No support No
Notes
Notes See bug 579788.
Edge No support No
Notes
No support No
Notes
Notes See this enhancement request.
Firefox No support No
Notes
No support No
Notes
Notes See bug 1215878.
IE No support NoOpera No support NoSafari Full support 9.1WebView Android No support No
Notes
No support No
Notes
Notes See bug 579788.
Chrome Android No support No
Notes
No support No
Notes
Notes See bug 579788.
Edge Mobile No support No
Notes
No support No
Notes
Notes See this enhancement request.
Firefox Android No support No
Notes
No support No
Notes
Notes See bug 1215878.
Opera Android No support NoSafari iOS Full support 9.3Samsung Internet Android No support No

Legend

Full support  
Full support
No support  
No support
See implementation notes.
See implementation notes.

See also

  • Use initial to set a property to its initial value.
  • Use unset to set a property to its inherited value if it inherits, or to its initial value if not.
  • Use inherit to make an element's property the same as its parent.
  • The all property lets you reset all properties to their initial, inherited, reverted, or unset state at once.

문서 태그 및 공헌자

이 페이지의 공헌자: Sheppy, fscholz, HTMLValidator, mfluehr, ebidel, teoli, cvrebert, yisibl, Sebastianz
최종 변경자: Sheppy,