CSS all property resets all the properties of an element to their initial or inherited value except for the unicode-bidi and direction property.
In the example below, properties font-size, color, and background will have no effect on the <p> element. This is because, after setting their values we have used all: initial; which will reset all these properties to their initial value. Try it out:
Example:
p{
font-size: 20px;
color: white;
background: tomato;
all: initial;
}
If we use all: inherit;, the current element inherits all the properties from the parent element. This means that all the properties applied to the parent element will also be applied to the child element. Refer to the example below:
Example:
.parent{
font-size: 20px;
border: 2px solid red;
padding: 20px;
}
.child{
all: inherit;
}
CSS Syntax
The all property has the below syntax:
all: initial|inherit|unset;
Property Values
The all property accepts the following values:
| initial | Resets all the properties applied to an element to their initial value. |
| inherit | Resets all the properties applied to an element and inherits their value from the parent element. |
| unset | Sets all the properties applied to an element to their inherited value if they are inherited by default or sets them to their initial value if they are not inherited by default. |
General Info
| Default Value | There is no default value for this property. |
| Inherited | No |
| JavaScript Usage | element.style.all = “initial”; |
