选择图片
生成 Data URL,可直接写进 CSS 的 background-image
等待选择图片…
关于图片转 Base64
Base64 把二进制数据编码成 64 个可打印字符,体积会比原文件大约三分之一。它的价值在于让图片能直接写进 HTML 或 CSS,减少一次 HTTP 请求。
- 只有几 KB 的小图标才值得内联,大图内联会让 HTML 体积暴涨,反而更慢。
- Data URL 的形式是 data:image/png;base64,xxxx,前面的 MIME 声明不能省。
- 内联图片不会被浏览器单独缓存,页面每次更新都要重新下载,所以别用在大图上。
- 编码结果是纯文本,可以安全地放进 JSON、CSS 或配置文件里。