CSS | all Property

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;

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

    • Syntax:
      all: initial;
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      <!DOCTYPE html> 
      <html
          <head
              <title>
                  CSS all aroperty
              </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>                    

      chevron_right

      
      

    • Output:
      GeeksforGeeks all property

    inherit: This property is used to set the all property from its parent element.

    • Syntax:
      all: inherit;
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      <!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>                    

      chevron_right

      
      

    • Output:
      GeeksforGeeks all property

    unset: This property is used to specify that all the element properties should be changed to their inherited values if they inherit by default, or to their initial values if not.

    • Syntax:
      all: unset;
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      <!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>                    

      chevron_right

      
      

    • Output:
      GeeksforGeeks all property

    revert: It is used to specify the behavior that depends on the style sheet origin to which the declaration belongs.