如何將圖像編碼成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 image converter

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

Embedding Base64 Images