如何将图像编码为 HTML 文件

Question

所以这可能是一个奇怪的问题，但请耐心等待。我正在为网站设计一段代码。我正在创建一个

<div></div>

包含所有内容的元素。样式标签和脚本标签都包含在其中。为了便于设计，他们只希望有一个包含脚本和 CSS 的 HTML 文件。我还有一个正在使用的背景图像。它在网页的其他地方使用，并且应该在代码插入网站时显示> 但是，由于我无法验证这一点，我想将图像包含到 HTML 文件中。我不是在谈论图像标签（如下）

<img src='image.jpg/>

我正在谈论以某种方式将图像包含或编码到物理 HTML 文件中，因此没有单独的 HTML 文件和 JPEG 文件，而只有一个 HTML 文件。这甚至可能吗？如果是这样，如何？

编辑：感谢 Base64 的帮助，但这可能会很长，并且会向 HTML 文件添加一大堆长度。还有其他可能的解决方案吗？

Answer 1

你可以对图像数据进行 base64 编码，所以你最终会得到这样的结果

<img src="data:image/gif;base64,R0lGODlhDwAPAKECAAAAzMzM/////
wAAACwAAAAADwAPAAACIISPeQHsrZ5ModrLlN48CXF8m2iQ3YmmKqVlRtW4ML
wWACH+H09wdGltaXplZCBieSBVbGVhZCBTbWFydFNhdmVyIQAAOw=="
alt="Base64 encoded image" width="150" height="150"/>

以下是一些资源：

Base64 图像转换器

http://www.bigfastblog.com/embed-base64-encoded-images-inline-in-html

嵌入 Base64 图像