默认显示电子邮件中的图像

时间:2015-04-29 13:00:03

标签: css email html-email mailchimp

我刚刚使用EDM的mailchimp发送了一封测试电子邮件,我已定制设计编码。一切正常,除非我特意点击“显示图像”,否则图像将无法显示。我在firefox上的gmail中查看。考虑到发送给我的其他电子邮件会自动显示图像,这很奇怪。这与Mailchimp中的编码或某些设置有关吗?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Grill10 | Results</title>
    </head>

    <body>
        <center>
            <table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="bodyTable" style="background:#3b4040;
                   padding-bottom: 100px;">

                <!-- HEADER -->
                <tr>
                    <td height="90px" width="100%" id="bodyTable" align= "center" style="background-image:
    linear-gradient(to right, #f00439, #f28d0d);" >
                        <img src="http://www.robertkoh.net/grill10site/img/g10logoEDM.png">
                    </td>
                </tr>

                <!-- ____ COMPLETED THE QUIZ -->
                <tr>
                    <td height="40px" width="100%" align= "center" style="display:inline-block;
                                                                          color:white;
                                                                          font-family:arial;
                                                                          font-size: 20px;
                                                                          margin-top: 20px;"
                                                                           >


                        <p id="username" style="display:inline-block;
                                                font-weight: bold;
                                                color:white;
                                                font-family:arial;">Janet</p>
                                                completed the quiz:
                    </td>
                </tr>

                <!-- QUIZ NAME -->
                <tr>
                    <td height="60px" width="100%" align= "center" style=
                                                                    "

                                                                    color:white;
                                                                    font-family:arial;
                                                                    font-size: 25px;
                                                                    text-transform: uppercase;
                                                                    line-height: 30px;
                                                                    padding-left: 10px;
                                                                    padding-right:10px;" >


                        <p id="quizname" style="display:inline-block;
                                                ">LAKERS FRANCHISE HISTORY REALLY LONG TITLE</p>

                       </td>
                </tr>

          <tr>
            <td>
              <table align="center" >
                <tr>
                  <td id= "scorebox" width= "80%" align="center" style="
                                                                                      color:white;
                                                                                      font-family:arial;
                                                                                      font-size: 25px;
                                                                                      line-height: 10px;
                                                                                      padding-bottom: 20px;
                                                                                      padding-left: 10px;
                                                                                      padding-right: 10px;
                                                                                      vertical-align: middle;">
                    <p id="username" style="font-weight:bold;display:inline-block;">JANET SMORTHSENWORTH</p> SCORED 8/10
                  </td>
                </tr>
              </table>
            </td>
          </tr>


                <!-- PROMPT -->

          <tr>
            <td>
              <table align="center" >
                <tr>
                  <td id= "scorebox" width= "80%" align="center" style="
                                                                                      color:white;
                                                                                      font-family:arial;
                                                                                      font-size: 20px;
                                                                                      line-height: 28px;
                                                                                      padding-bottom: 20px;
                                                                                      padding-left: 10px;
                                                                                      padding-right: 10px;
                                                                                      vertical-align: middle;">Think you can do better? Click below to try yourself!
                  </td>
                </tr>
              </table>
            </td>
          </tr>

                <!-- CTA BUTTON -->
                <tr>
                    <td>
                        <a href="#" style="text-decoration: none;">
                            <table height="50px" width="280px" align= "center" style="background: #68c357;
                                                                                      border-bottom: 6px solid #009d22;
                                                                                      color:white;
                                                                                      font-family:arial;
                                                                                      text-decoration: none;
                                                                                      ">
                                <tr>
                                    <td align= "center">
                                        GRILL ME
                                    </td>
                                </tr>
                            </table>
                        </a>
                    </td>
                 </tr> 

                 <!-- SOCIAL -->
                 <tr>
                    <td align="center">
                        <a href="#"><img src="http://www.robertkoh.net/grill10site/img/fbEDM.png" style="margin-top: 40px; margin-right: 13px;"></a>
                        <a href="#"><img src="http://www.robertkoh.net/grill10site/img/twitterEDM.png"></a>
                    </td>
                 </tr>        
            </table>


        </center>
    </body>
</html>

1 个答案:

答案 0 :(得分:1)

您可以在图像拦截方面做任何事情(作为发送方)。它是客户端的默认设置,由用户/收件人控制。

这是许多电子邮件客户端使用的一项安全措施,旨在通过下载的文件/图像帮助保护用户免受潜在的恶意攻击。现在有很多人使用缓存的图像系统,允许电子邮件客户端将图像下载到沙盒服务器中,然后扫描文件以查找任何潜在的问题。通过这样做,它允许图像自动安全地显示给收件人,因为他们将从审查的沙箱中下载而不是直接从未受保护的源下载。

如果您个人希望Gmail自动显示图片,请访问此处获取相关说明:https://support.google.com/mail/answer/145919?hl=en