Base64.imBase64 在线编码解码(最好用的 Base64 在线工具)
Base64.im使用教程
1. 为什么使用 Base64 编码？
Base64 编码是一种将二进制数据（如图像文件）转换为文本格式的方式，非常适合以下场景：
- 快速加载小型图像：将 Base64 图像嵌入 HTML 或 CSS 文件中，避免额外的 HTTP 请求，提高加载速度。
- HTML 电子邮件签名：通过 Base64 编码嵌入图像，避免触发电子邮件客户端中的“显示图像”警告。
- 单文件演示：为客户创建无需外部资源的单文件模型或演示页面。
2. 支持的图片格式
本工具支持以下常见图像格式的编码：.jpeg、.png、.gif、.webp、.svg、.BMP和.bmp。
3. 如何使用base64.im转换图像
上传图像：通过拖动图像文件到浏览器窗口或点击上传按钮，选择您要编码的图像。
查看结果：文件上传后，您可以在下方看到 Base64 字符串。
上传数量限制：您一次最多可以上传20个文件。
4. 使用 Base64 编码的图像作为 HTML 图片来源
Base64 字符串可以用作 HTML 中 `img` 标签的 `src` 属性值。以下是一个示例：
<img src="data:image/jpeg;base64,/9j/4RiDRXhpZgAATU0AKgA..." width="100" height="50" alt="base64 test">
使用步骤：
①. 点击工具提供的复制按钮，将 Base64 字符串复制到剪贴板。
②. 如果您的浏览器不支持直接复制，可以手动从对话框中复制字符串。
③. 将字符串粘贴到 HTML 文件中的 `src` 属性中。
您可以在CodePen上查看base64 图像演示。
5. 使用 Base64 编码的图像作为 CSS 背景
Base64 字符串也可以用作 CSS 的 `background` 属性值，用于定义背景图像。以下是一个示例：
.my-class {
background: url('data:image/jpeg;base64,/9j/4RiDRXhpZgAATU0AKgA...');
}
使用步骤：
①. 点击工具的复制按钮，将 Base64 字符串复制到剪贴板。
②. 如果复制按钮不可用，您可以手动从对话框中复制字符串。
③. 将字符串粘贴到 CSS 文件中的 `url()` 参数中。
您可以在CodePen上查看base64 CSS 演示。
6. 注意事项
Base64 编码适合小型图像，大型文件可能会增加文件体积，不建议在大型图片或需要频繁加载的资源中使用。
请确保编码后的字符串符合项目需求并在不同设备上正常显示。
通过以上步骤，您可以轻松使用 Base64 工具完成图片编码任务，提高开发效率！