You need to consider the use of revert
The revert CSS keyword reverts the cascaded value of the property from its current value to the value the property would have had if no changes had been made by the current style origin to the current element. Thus, it resets the property to its inherited value if it inherits from its parent or to the default value established by the user agent’s stylesheet ref
initial won’t be good because it does something different
The initial CSS keyword applies the initial (or default) value of a property to an element. It can be applied to any CSS property. This includes the CSS shorthand all, with which initial can be used to restore all CSS properties to their initial state.
Note the of a property. So initial won’t consider the default CSS of the browser.
Related: What’s the difference between `all: unset` and `all: revert’
I want to make a part of my website display html in its defualt style essentially ignoring all other css files only for certain elements.
So I try all: initial !important; It gives me the output I want but when using h1 tag the output text has font-size 19px which should be 32px instead, is there something I am doing wrong or is this a browser bug?
edit: when using revert I get weard effect see:https://imgur.com/a/pEmJFpw
for more explanation see my comment below this post
I did try it before an didn’t work but when giving it another try I found out that it works for some selection types but not all like when I use * to select all elments and set the color for example to red and I revert only one to by class selector all: revert !important; it doesn’t work while showing in in firefox inspector as crossed, but when using h1 as a selector for red color and defualt using class selector and all: revert !important; I get wanted result,why is that? here is an image for examples :
