HTML CSS

HOW TO RESET CSS ON HTML ELEMENTS

a real quick guide

#demoA { color: red; } #demoB { color: green; }

RESET TO "INITIAL"

01

RESET TO BROWSER DEFAULT <div id="demoA"><p id="demoB"   onclick="this.style.color='initial'">   Green - Reset to black. </p></div> 

RESET TO "INHERIT"

02

#demoA { color: red; } #demoB { color: green; }

RESET TO PARENT <div id="demoA"><p id="demoB"   onclick="this.style.color='initial'">   Green - Reset to red. </p></div> 

#demoA { color: red; } #demoB, #demoD { color: green; }

RESET TO "UNSET"

03

RESET TO PARENT <div id="demoA"><p id="demoB"    onclick="this.style.color='unset'">    Green - Reset to red. </p></div>

FALLBACK TO BROWSER DEFAULT WHEN PARENT IS NOT SET <div id="demoC"><p id="demoD"   onclick="this.style.color='unset'">   Green - Reset to black. </p></div> 

RESET TO USER'S CUSTOMIZED STYLES. FALLBACK TO BROWSER DEFAULT. <div id="demoA"    onclick="this.style.color='revert'">   Red - Reset to color that user has set in   browser customize. If not, revert to black. </div> 

RESET TO "REVERT"

04

#demoA { color: red; }