🖼️ 图片转Base64工具
在线将图片转换为Base64编码,支持预览
🔒 图片处理完全在浏览器本地完成,不会上传到服务器
📁
点击或拖拽图片到此处
支持 JPG、PNG、GIF、WebP 等格式
📚 使用说明
什么是 Base64 图片?
Base64 是一种将二进制数据编码为ASCII字符串的方法。图片转Base64后可以直接嵌入到HTML、CSS或JSON中,无需单独的图片文件。
Data URL 格式
data:[MIME类型];base64,[Base64编码数据]
示例:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...
使用场景
- 小图标和Logo嵌入CSS
- 减少HTTP请求
- 邮件中嵌入图片
- JSON API中传输图片
- Canvas图片导出
HTML 中使用示例
<img src="data:image/png;base64,iVBORw0KGgo..." alt="图片">
CSS 中使用示例
.logo {
background-image: url(data:image/png;base64,iVBORw0KGgo...);
}
优缺点
优点:
- 减少HTTP请求数量
- 无需单独的图片文件
- 便于传输和存储
- 避免跨域问题
缺点:
- 编码后体积增加约33%
- 不利于缓存
- 大图片会影响页面加载
- 不利于SEO
最佳实践
- 仅用于小图片(< 10KB)
- 常用图标适合 Base64
- 大图片使用 CDN
- 考虑浏览器缓存策略