Custom property fallback values
Using the var()
function, you can define multiple
fallback values when the given variable is not yet
defined
.two {
/* Red if --my-var is not defined */
color: var(--my-var, red);
}
.three {
/* pink if --my-var and --my-background are not defined */
background-color: var(--my-var, var(--my-background, pink));
}
.three {
/* Invalid: "--my-background, pink" */
background-color: var(--my-var, --my-background, pink);
}