CSS all Property

Description

The all property resets all properties of the element to their original or inherited value (with the exception of the direction property, which controls the direction of the text and the unicode-bidi property , which allows the use of a bidirectional text display algorithm.
It is assumed that this property will simplify the integration of third-party blocks on site pages, as the impact of inline website styles will be minimized.

Initial value: See individual properties
Applies to: See individual properties
Inherited: See individual properties
Media: See individual properties
Computed value: See individual properties
Animatable: See individual properties
CSS Version: CSS3
JavaScript syntax: object.style.all

Syntax

all: initial | inherit | unset

Values

initialThis keyword will change all the properties applying to the element or the element to their initial value.
inheritThis keyword will change all the properties applying to the element or the element to their parent value.
unsetThis keyword will change all the properties applying to the element or the element to their parent value if they are inheritable or to their initial value if not.

Example

HTML

<div>Regular block<div> 

<div class="test">all: initial;<div> 

<div class="test2">all: inherit;<div> 

<div class="test3">all: unset;<div>

CSS

body {
   color: blue; 
   font-size: small; 
   background: azure; 
} 
div {
   color: red; 
   background: skyblue; 
} 
.test {
   all: initial;
} 
.test2 {
   all: inherit; 
} 
.test3 {
   all: unset;
}

Result