Skip to content
Related Articles

Related Articles

CSS | all Property

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

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
Recommended Articles
Page :

Start Your Coding Journey Now!