all
Quick Summary for all
The all shorthand CSS property resets all of an element's properties except unicode-bidi, direction, and CSS Custom Properties. It can set properties to their initial or inherited values, or to the values specified in another stylesheet origin.
Code Usage for all
/* Global values */ all: initial; all: inherit; all: revert; all: unset; 
More Details for all

all

The all shorthand CSS property resets all of an element's properties except unicode-bidi, direction, and CSS Custom Properties. It can set properties to their initial or inherited values, or to the values specified in another stylesheet origin.

Syntax

/* Global values */ all: initial; all: inherit; all: revert; all: unset; 

The all property is specified as one of the CSS global keyword values. Note that none of these values affect the unicode-bidi and direction properties.

Values

initial

Specifies that all the element's properties should be changed to their initial values.

inherit

Specifies that all the element's properties should be changed to their inherited values.

unset

Specifies that all the element's properties should be changed to their inherited values if they inherit by default, or to their initial values if not.

revert

Specifies behavior that depends on the stylesheet origin to which the declaration belongs:

User-agent origin

Equivalent to unset.

User origin

Rolls back the cascade to the user-agent level, so that the specified values are calculated as if no author-level or user-level rules were specified for the element.

Author origin

Rolls back the cascade to the user level, so that the specified values are calculated as if no author-level rules were specified for the element. For purposes of revert, the Author origin includes the Override and Animation origins.

Formal definition

Initial valueThere is no practical initial value for it.
Applies toall elements
Inheritedno
Computed valueas the specified value applies to each property this is a shorthand for.
Animation typeas each of the properties of the shorthand (all properties but unicode-bidi and direction)

Formal syntax

initial | inherit | unset | revert

Examples

HTML

<blockquote id="quote">   Lorem ipsum dolor sit amet, consectetur adipiscing elit. </blockquote> Phasellus eget velit sagittis. 

CSS

body {   font-size: small;   background-color: #F0F0F0;   color: blue;   margin: 0;   padding: 0; }  blockquote {   background-color: skyblue;   color: red; } 

Result

No all property

The <blockquote> uses the browser's default styling which gives it a margin, together with a specific background and text color. It also behaves as a block element: the text that follows it is beneath it.

all:unset

The <blockquote> doesn't use the browser default styling: it is an inline element now (initial value), its background-color is transparent (initial value), but its font-size is still small (inherited value) and its color is blue (inherited value).

all:initial

The <blockquote> doesn't use the browser default styling: it is an inline element now (initial value), its background-color is transparent (initial value), its font-size is normal (initial value) and its color is black (initial value).

all:inherit

The <blockquote> doesn't use the browser default styling: it is a block element now (inherited value from its containing <body> element), its background-color is #F0F0F0 (inherited value), its font-size is small (inherited value) and its color is blue (inherited value).

Specifications

Specification
CSS Cascading and Inheritance Level 3 # all-shorthand

See also

CSS global keyword values: initial, inherit, unset, revert

Last modified: Aug 12, 2021, by MDN contributors

Select your preferred language English (US)DeutschEspañolFrançais日本語한국어Русский中文 (简体) Change language

No Items Found.

Add Comment
Type in a Nick Name here
 
Other Categories in CSS
css
Search CSS
Search CSS by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it. more...

Subscribe to weekly updates about things i have added to the site or thought interesting during the last week.

You could also follow me on twitter or not... does anyone even use twitter anymore?

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕

❤️👩‍💻🎮

🪦 2000 - 16 Oct 2022 - Boots
Random Quote
A person who never made a mistake never tried anything new.
Albert Einstein
Random CSS Property

grid-area

The grid-area CSS shorthand property specifies a grid item's size and location within a grid by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the edges of its grid area.
grid-area css reference