I've noticed in the W3C docs that cross-fade() is defined as follows:
cross-fade() = cross-fade( <cf-mixing-image> , <cf-final-image>? )
where
<cf-mixing-image> = <percentage>? && <image>
<cf-final-image> = <image> | <color>
Now, in the same document, click on the link for <image>
and this is defined as:
<image> = <url> | <cross-fade()> | <gradient>
In other words, cross-fade()
(via <image>
) can be recursively defined an infinite number of times; here is the n = 3
(3 nested cross-fade()
instances) case:
background: cross-fade(50% cross-fade(40% cross-fade(60% cross-fade(10% url('http://www.randomimage.com/image.png'), white), blue), red), green);
Can this function be recursively defined an infinite number of times, and if so, how would an increasing number of nested cross-fade() statements affect performance?