Another important distinction is that
initial bypasses inheritance while
revert does not. So if the property is inheritable and the user agent style sheet does not match the element and declare a value for the property, then its value will determined via inheritance (from the element’s ancestors).
This is not correct.
revertare global property values, i.e., they can be used on any property. They work the same in that regard, so it’s not true that
initialacts per property, and
revertper selector. Both are set on properties.
revertare the same type of value, but…
This may not always be desirable since it disables user agent styles as well. Certain user agent styles are good defaults.
Maybe instead of initializing all styles on elements like paragraphs (like in your code example), it would make more sense to do it on the custom element’s :host element. This would stop CSS inheritance…