@@ -63,11 +63,32 @@ The <<image>> value type denotes a 2D image. It can be a
6363 including the 'background-image' , 'list-style-image' , 'cursor' properties [[!CSS21]]
6464 (where it replaces the <<url>> component in the property's value).
6565
66- In some cases, an image is invalid,
67- such as a <<url>> pointing to a resource that is not a valid image format.
66+ In some cases an image is invalid,
67+ such as a <<url>> pointing to a resource that is not a valid image format
68+ or that has failed to load.
6869 An <dfn export lt="invalid image|valid image">invalid image</dfn> is rendered as a solid-color ''transparent'' image with no intrinsic dimensions.
69- However, <a>invalid images</a> have special behavior in some contexts,
70- such as the ''image()'' notation.
70+ However, <a>invalid images</a> can trigger error-handling clauses
71+ in some contexts.
72+ For example, an <a>invalid image</a> in 'list-style-image'
73+ is treated as ''list-style-type/none'' ,
74+ allowing the 'list-style-type' to render in its place. [[CSS2]]
75+
76+ While an image is loading,
77+ is is a <dfn export>loading image</dfn> .
78+ [=Loading images=] are <em> not</em> [=invalid images=] ,
79+ but have similar behavior:
80+ they are rendered as a solid-color ''transparent'' image with no intrinsic dimensions,
81+ and may trigger fallback rendering in contexts that offer it,
82+ but must not trigger loading of fallback resources.
83+
84+ Partially-loaded images (whose [=intrinsic dimensions=] are known, but whose image data is not fully loaded)
85+ may be either treated as [=loading images=]
86+ or as loaded images rendered with partial data.
87+ For example, a UA may render an interlaced GIF in place
88+ as soon as its first pass of pixel data has loaded
89+ or even as soon as the image header (which contains sizing data) has parsed
90+ and refresh the rendering as more data loads;
91+ or it may wait until the entire image has loaded before using it.
7192
7293Image File Formats {#image-file-formats}
7394----------------------------------------
@@ -216,10 +237,14 @@ Image Fallbacks and Annotations: the ''image()'' notation {#image-notation}
216237### Image Fallbacks ### {#image-fallbacks}
217238
218239 If both a URL and a <<color>> are specified in ''image()'' ,
219- then whenever the URL represents an <a> invalid image</a> ,
240+ then whenever the URL represents an [= invalid image=] or [=loading image=] ,
220241 the ''image()'' function renders as if the URL were not specified at all;
221242 it generates a solid-color image as specified in [[#color-images]] .
222243
244+ If just a URL is specified (no <<color>> )
245+ and it represents an [=invalid image=] or [=loading image=] ,
246+ the ''image()'' function represents the same.
247+
223248 <div class='example'>
224249 The fallback color can be used to ensure that text is still readable
225250 even when the image fails to load.
0 commit comments