asp.net 中的 html 电子邮件中的背景图像 css答案

【问题标题】：Background-image css inside an html email in asp.netasp.net 中的 html 电子邮件中的背景图像 css
【发布时间】：2014-03-21 12:58:11
【问题描述】：

我需要发送带有嵌入图像作为邮件正文的邮件。下面是代码

 <!DOCTYPE html>
 <html>
 <head></head>
 <body>
 <div style="background: url(http://localhost/image/mvp-bg.jpg) no-repeat top left; width: 800px; height:685px; margin: 0 auto; color: #ffffff; font-family: Arial; font-size: 16px;">
    <div style="width: 700px; margin: 0 auto; padding-top: 80px;">
        <p>Mail Body</p>
    </div>
 </div>
 </body>
 </html>

谁能告诉我如何解决这个问题。谢谢

【问题讨论】：

如果您发送电子邮件，您将无法在客户端计算机上引用 localhost，除非他们设置了具有相同目录结构的 Web 服务器。

标签： asp.net

【解决方案1】：

对于电子邮件模板，最好从服务器而不是localhost 引用图像，您不能指望用户将图像加载到他们的本地主机中:)

改成url(http://domain.com/image/mvp-bg.jpg)

【讨论】：

将 url similat 更改为“domain.com/image/mvp-bg.jpg”并没有解决我的问题。请帮忙

【解决方案2】：

从html email with background-image style not shown 获得解决方案。下面也是我修改的代码，以便在邮件中正确呈现 css。使用标签时，css 没有呈现，因此使用了表格标签。

  <!DOCTYPE html>
  <html xmlns:v="urn:schemas-microsoft-com:vml">
   <head>
   <style type="text/css">
    v\:*
    {
        behavior: url(#default#VML);
        display: inline-block;
    }
</style>
</head>
<body>
 <table style="background-image: url('image/mvp-bg.jpg'); background-repeat: no-repeat;width: 800px; height:685px; margin: 0 auto; color: #ffffff; font-family: Arial; font-size: 16px;" >
    <!--[if gte vml 1]>
                <v:shape 
                    stroked='f'
                     style='position:absolute;margin-left:-90pt;margin-top:-1.55pt;     
                            z-index:-503306481;
                            visibility:visible;
                            width:720pt;
                            height:475pt;           
                            top:0;
                            left:0;
                            border:0;                                               
                            '>
                    <v:imagedata src="http://www.domain.com/image/mvp-bg.jpg"/>
                </v:shape>
        <![endif]-->
    <tbody>
        <tr>
            <td>
               <div style="width: 700px; margin: 0 auto; padding-top: 85px; font-family: Arial; font-size: 16px;">                        
                  <table cellspacing="0" cellpadding="0" border="0">
                        <tr>
                            <td colspan="2" valign="top" style="padding: 10px; color: #ffffff;">
                               Mail Body
                            </td>
                        </tr>
                        </table>                        
                </div>
            </td>
        </tr>
    </tbody>
</table>

【讨论】：