Skip to content
Related Articles
Open in App
Not now

Related Articles

CSS | all Property

Improve Article
Save Article
  • Difficulty Level : Medium
  • Last Updated : 31 Jul, 2022
Improve Article
Save Article

The all property in CSS is the shorthand property that is used to set all the elements values to their initial or inherited values or in some cases used to set the values to another spreadsheet origin. This property is used to reset all the CSS property in a document.

Syntax: 

all: initial|inherit|unset|revert|revert-layer;

Default Value : Its default value is none.

Property Values: 
initial: This property is used to set all property to its default value. 
 

  • Syntax: 
     
all: initial;
  • Example: 
     

html




<!DOCTYPE html>
<html>
    <head>
        <title>
            CSS all property
        </title>
         
        <!-- CSS all property -->
        <style>
            h1, h3 {
                background-color: yellow;
                color: green;
                all: initial;
            }
            body {
                text-align: center;
                all: initial;
            }
        </style>
    </head>
     
    <body>
        <h1>GeeksforGeeks</h1>
        <h3>all property</h3>
    </body>
</html>                   


  • Output: 
     
GeeksforGeeks all property
  •  
  • Syntax: 
     
all: inherit;
  • Example: 
     

html




<!DOCTYPE html>
<html>
    <head>
        <title>All Property</title>
        <style>
            div {
                text-align:center;
                color:green;
                all:initial
            }
            h1, h3 {
                all: inherit;
            }
        </style>
    </head>
    <body>
        <div>
            <h1>GeeksforGeeks</h1>
            <h3>all property</h3>
        </div>
    </body>
</html>                   


  • Output: 
     
GeeksforGeeks all property
  •  
  • Syntax: 
     
all: unset;
  • Example: 
     

html




<!DOCTYPE html>
<html>
    <head>
        <title>
            CSS all property
        </title>
         
        <style>
            h1, h3 {
                background-color: green;
                color: white;
                all: unset;
            }
            body {
                text-align: center;
                all: unset;
            }
        </style>
    </head>
     
    <body>
        <h1>GeeksforGeeks</h1>
        <h3>all property</h3>
    </body>
</html>                   


  • Output: 
     
GeeksforGeeks all property
  •  
  • Syntax: 
     
all: revert;
  • Example: 
     

html




<!DOCTYPE html>
<html>
    <head>
        <title>
            CSS all property
        </title>
         
        <style>
            h1, h3 {
                background-color: yellow;
                color: green;
                all: revert;
 
            }
            body {
                text-align: center;
                all: revert;
            }
        </style>
    </head>
     
    <body>
        <h1>GeeksforGeeks</h1>
        <h3>all Property</h3>
    </body>
</html>                   


  • Output: 
     

supported browser to run code CSS all property:

  • Chrome 37.0
  • Firefox 27.0
  • Opera 24.0
  • Safari 9.1
  • Microsoft Edge 79.0

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!