Hello @VladimirK
You are right that you could choose any of the four special keywords. Although your explanation is not completely right.
We need to know two thing to understand why those keywords make no difference:
- Initial value of
background-color
is transparent
-
background-color
is not an inherited property
Now lets look at those four keywords:
-
initial
: The initial value as in the specification transparent
-
inherit
: Inherited from the parent. As the parent has no background-color
specified that’s its initial value transparent
-
unset
: inherit
for inherited properties or initial
for non-inherited properties. As background-color
is a non-inherited property that’s its initial value transparent
-
revert
: inherit
for inherited properties or the default from the browser’s stylesheet. As background-color
is a non-inherited property that’s the browser 's default transparent
usnet
and revert
are very similar but for some properties the values for non-inherited properties are different. For example the initial value for display
is inline. Therefore those rules behave differently:
/* Becomes "inline" (initial value) */
h1 {
display: unset;
}
/* Becomes "block" (browser stylesheet value) */
h1 {
display: revert;
}
So mostly you want to use revert
instead of unset
. It’s also the newest of the four special keywords.
You are right. Fonts with spaces in their name should always be quoted. Nice catch! You could create a pull request if you like: https://github.com/mdn/css-examples/issues. If you want me to do it, no problem just say it.
Uff! That was a rather long explanation for this short exercise
I hope this clears it up a bit.
Bye
Michael