我正在尝试创建单个文件HTML5文档，该文档可以通过电子邮件发送给包含运行它所需的所有标记，js，css和图像的人。
我知道描述离线流程的文章，例如http://diveintohtml5.info/offline.html，但是想知道嵌入其资源的最佳方法，例如大图像和js文件。
我会为这些使用base64编码还是有更好的方法？
应用程序将在相当新的浏览器上运行。
答案 0 :(得分：4)
是的，base64对图像进行编码。我做的是在转换为base64之前将它们保存为png并保持正确的大小（有免费的在线网站可以为您完成）。这节省了大量空间。
要将数据保存到localfile，请使用HTML5本地存储，以下是指南：http://www.html5rocks.com/en/features/storage。
对于JS / CSS文件，只需将它们粘贴到头部即可，没什么大不了的！
答案 1 :(得分：0)
对于某些工作，我不得不非常积极地做到这一点。
要显着减小文件大小，如果图形是艺术线条而不是照片，我更喜欢将其转换为可缩放的矢量图形文件（.svg）。这些是当今大多数浏览器自行理解的文本文件，可以轻松地直接嵌入HTML文件中。根据您要执行的操作，这里有一些选择，范围包括直接使用带有命令的标签来驱动它，或者将其嵌入为样式表组件，以便通过使用数据URI（例如.my_image{background:url(data:image/svg+xml;charset=UTF-8,[SVG file without newlines]);}，可在此处找到更多详细信息：https://css-tricks.com/using-svg/）。确保您已在要使用此浏览器的所有浏览器上进行了测试...尽管我不得不使用charset = US-ASCII并对其进行一些过滤，但我已经能够在IE，Chrome，Firefox和Edge上成功完成此操作SVG文字使其生效。
对于字体，我使用Font Squirrel从我上传的字体文件生成一个Webkit（使用高级选项，并设置stylesheet.css以将字体嵌入其中，因此您可以将生成的文本复制到自己的字体中页）。
外部样式表和JavaScript可以直接复制到HTML中，如前所述。
答案 2 :(得分：-1)
很老的问题，但对于其他人来说，这是一个完美的应用程序/扩展程序： https://chrome.google.com/webstore/detail/singlefile/mpiodijhokgodhhofbcjdecpffjipkle
此外，您可以使用任何浏览器用户代理字符串更改器加载页面的移动版本，然后将其保存到单个 html 文件（包含所有图像媒体 css 中的所有内容），该文件在智能手机上显示良好，您只需要发送单个文件。
如果您想从 PDF 而不是网页创建，那么您可以使用 www.zamzar.com 或此类在线转换器并选择 1-page HTML5 选项。