如何让电子邮件客户端识别HTML图像

时间:2013-12-11 10:04:09

标签: html5

如何让电子邮件客户端识别HTML图像。如果我运行以下网页图像很好。作为电子邮件发送,他们消失。将图像放在blob中就是答案。

<!DOCTYPE html>
<html>
<head>
<title></title>

</head>

<body style="min-height:100%; padding-top:50px; background-color:lightgray; background-   repeat:no-repeat; background-size:cover; background-image:url('../../Content/images/image1.png');">

2 个答案:

答案 0 :(得分:0)

尝试将背景更改为base64编码的图像。有许多可以进行编码的在线服务,例如here

所以,最后你的CSS应该是这样的:

background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJAAAACQCAYAAADnRuK4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA/JpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ1dWlkOmVmMjMyNzlhLTNmMjEtNDU2NS1iYzIzLWY2MTEwYTJjNWVkNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpCQjU3RjgyNEZGNDIxMUUyQTU1Q0I4MkZBM0NBNDJERiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpCQjU3RjgyM0ZGNDIxMUUyQTU1Q0I4MkZBM0NBNDJERiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBJbGx1c3RyYXRvciBDUzYgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InV1aWQ6YjA5OWIyZTktZmNkNS00NDZhLWI0MjgtYzVlMWMxZWM2ZTk4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkE5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);

答案 1 :(得分:0)

Outlook(客户端和Webmail)不支持任何方式的后台映像。您需要将它们更改为标签。以下是支持的属性表: http://www.campaignmonitor.com/css/