The background picture in html is loaded first.

as mentioned in the topic, how to load the background picture first.
now you can see that each time the image is loaded, the image is loaded after the content of the page is loaded, with a white background color in the middle.
how can I modify the intermediate process of white so that I can"t see it?

Dec.14,2021
When the

picture is large, it may return last even if the request is sent first.
consider displaying a low-quality background image first, and then loading the original image with js and replacing it.


background-image: url (data:image/png;base64, Barabara)


there are several ideas

  1. you can first render a thumbnail of a small background image and, if necessary, use webpack to convert the thumbnail into base64 and compress it in the code. Avoid a blank background. Then request a complete background image to render. Zhihu does this
  2. Previous: In vscode, html and JavaScript are indented to four spaces, but they are automatically formatted and changed to two spaces when saved.

    Next: How to configure LF or CRLF? in vscode

Menu