html - 如何在不下载 HTML 以外的任何内容的情况下将 png 作为背景图像包含在内？

Question

我正在生成一个 html 文件。该文件应显示 3 个 div。每个 div 将有:

background-image: url("something.png");

现在，当用户下载文件时(例如选择“页面另存为”)，他只会得到 HTML，而没有实际的 png 文件。

我怎样才能确保他能够看到它们，而不是让他下载它们？

我试过转换为 SVG，但是这张图片有多种颜色，而且完全失败了。

Answer 1

你可以让它基于数据，即

background:url(data:image/png;base64,base64-encoded-image-goes-here)

可以有jpg、gif等

您可以使用图像到 base64 转换器获取 base64 图像。