如何成功地在HTML中嵌入图像，以便在webmail客户端显示？
如何成功地在HTML中嵌入图像，以便在webmail客户端显示？
提问于 2012-10-24 20:42:04
我正在尝试用HTML做一个签名，使用的是用base64数据URL编码的图像。下面是一个例子：
<img src="data:image/png;base64,iVBORw0KGgoAAAAN...kJggg==">它适用于邮件软件，如mail on Mac或Thunderbird，但不适用于网页邮件，如gmail，outlook，roundcube，hotmail……
你知道怎么让它工作吗？我真的很想把这些图片直接放到源代码中，这样更实用。
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-10-24 22:18:00
简单的答案？
你不能。Gmail，outlook等都会忽略base64图片。
Look at this site to learn more about this
所以根据我们的结果，在你的电子邮件中使用嵌入图像显然是不值得的。你所要做的就是强迫人们下载他们将无法查看的编码图像。
Stack Overflow用户
发布于 2016-09-18 05:41:51
我使用的是嵌入式SVG，原因如下：
- 它看起来不错(矢量图形很适合徽标)。
- 没有附件(即使是以所谓的隐藏电子邮件附件的形式邮寄的图像在许多电子邮件客户端中也是可见的)。
- 没有额外的http请求(脱机工作，一旦downloaded).
- No“你想加载图像吗？”)。问题。
- 如果它不能在Gmail和
- 中显示，对我来说没问题。这是一种优雅的degradation.
但如果你真的想在Gmail和Outlook中显示图片，你需要通过HTTP加载这些图片。
CSS-tricks的家伙在电子邮件中有一个关于SVG的很好的指南：https://css-tricks.com/a-guide-on-svg-support-in-email/
最终的解决方案如下：
/* Resize an element that has a width and height of zero to full size */
.showy {
height: 100% !important;
width: 100% !important;
}<!-- Image: SVG -->
<img class="showy" width="0" height="0" src="my-image.svg">
<!-- Image: JPG -->
<img class="no-showy" src="my-image.jpg">
但我个人不喜欢它，因为我不希望客户端询问用户是否要加载额外的资源。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13049453
复制相关文章
相似问题