CSS properties - all

revision:

all property

The all property resets all properties, apart from unicode-bidi and direction, to their initial or inherited value.

CSS syntax : all: initial | inherit | unset;

Property values

initial : changes all the properties applied to the element or the element's parent to their initial value.

inherit : changes all the properties applied to the element or the element's parent to their parent value

unset : changes all the properties applied to the element or the element's parent to their parent value if they are inheritable or to their initial value if not

JavaScript syntax: object.style.all="initial"

example: all property

No "all" property:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

all: inherit:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

all: initial:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

all: unset:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
code: 
                    <div class="parent">"
                        <p style="margin-left: -2vw;">No "all" property:</p>
                        <div id="ex1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
                        labore et dolore magna aliqua.</div>
                        <p  style="margin-left: -2vw;">all: inherit:</p>
                        <div id="ex2">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
                        labore et dolore magna aliqua.</div>
                        <p  style="margin-left: -2vw;">all: initial:</p>
                        <div id="ex3">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
                        labore et dolore magna aliqua.</div>
                        <p  style="margin-left: -2vw;">all: unset:</p>
                        <div id="ex4">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
                        labore et dolore magna aliqua.</div>
                    </div>
                    <style>
                        .parent{font-size: small; color: blue;}
                        #ex1 {background-color: yellow; color: red;}
                        #ex2 {background-color: yellow; color: red; all: inherit;}
                        #ex3 {background-color: yellow; color: red; all: initial;}
                        #ex4 {background-color: yellow; color: red; all: unset; }
                    </style>