how to make images in html mail presented in outlo

问题:

I've this html which i'm sending as a mail (see fiddle) in which i use 2 external images (one for the company logo and one for the table background) : :

http://jsfiddle.net/UTSnK/

<img src="http://www.hawkaviation.com/assets/static-header.jpg" alt="Hawk Aviation""/></a>

<table border="0" cellspacing="0" cellpadding="0" style="background:rgba(55, 20, 240, 0.99) url('http://www.hisplaceautorepair.com/images/auto/Primary_Images/napa_bg.jpg'); padding: 38px">

I send it from code to many email clients : gmail, yahoo, ios. Only in outlook client the pictures are not presented:

How can I overcome it? Is this related to the way I'm sending it (via c# code) or the way the images are linked to the html?

I'd appreciate a step by step answer. Regards, Omer.

回答1:

This is how I got this working in Outlook

private MailMessage report = new MailMessage();

...

if (this.report.IsBodyHtml)
{
            AlternateView htmlView = AlternateView.CreateAlternateViewFromString(this.bodyText.ToString(), this.report.BodyEncoding, "text/html");

            LinkedResource headerImageLink = new LinkedResource(ConfigReader.GetConfigValue("ImageLocation") + "\\MyBanner.gif", "image/gif");
            headerImageLink.ContentId = "headerImageId";
            headerImageLink.TransferEncoding = System.Net.Mime.TransferEncoding.Base64;

            LinkedResource footerImageLink = new LinkedResource(ConfigReader.GetConfigValue("ImageLocation") + "\\horizontal_c.gif", "image/gif");
            footerImageLink.ContentId = "footerImageId";
            footerImageLink.TransferEncoding = System.Net.Mime.TransferEncoding.Base64;

            htmlView.LinkedResources.Add(headerImageLink);
            htmlView.LinkedResources.Add(footerImageLink);

            this.report.AlternateViews.Add(htmlView);
}

The HTML to reference the above image is:

<IMG src=\"cid:headerImageId\"/>

the headerImageId refers to the ContentId of the LinkedResource.

Basically you're converting the image to text for transfer which gets re-constituted as an image on arrival at the client.

回答2:

You are having this problem because outlook isn't rendering the external images without the user clicking download on the images or they don't have option to automatically download external images selected.

The way you fix this is that you have to embed the images into the email message.

To embed an image you have to use and AlternatView object and a LinkedResource object.

You can find example code on how to do this at: How to embed multiple images in email body using .NET