HTML 解决outlook邮箱邮件不显示背景图问题

最新推荐文章于 2024-07-13 09:19:02 发布

前端无冕之王

最新推荐文章于 2024-07-13 09:19:02 发布

阅读量280

点赞数 4

文章标签： html outlook 前端

本文链接：https://blog.csdn.net/m0_64036296/article/details/139236261

版权

1.<head>标签中添加

<head>
      <!--[if gte mso 9]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
</head>

2.需要使用背景图的部分添加

<!--[if gte mso 9]>

<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:660px;display:block;height:25px;">

<v:fill type="frame" src="../email_plus_client_survey_edm3_en20240517img_03_02.jpg" Color="#1c2836" />

<v:textbox inset="0,0,0,0">

<![endif]-->

<tr>
<td bgcolor="#1c2836" valign="top" width="660" height="25" align="center"
                  background="../email_plus_client_survey_edm3_en20240517img_03_02.jpg"
                  style="background-image:url('../email_plus_client_survey_edm3_en20240517img_03_02.jpg');background-Color:#1c2836;background-repeat: no-repeat; background-size:660px 25px;background-position:center;vertical-align: top; padding:0; margin:0px; text-align:center;background-color: #002329;">
                  <!--[if gte mso 9]>
              <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:660px;display:block;height:25px;">
              <v:fill type="frame" src="../email_plus_client_survey_edm3_en20240517img_03_02.jpg" Color="#1c2836" />
              <v:textbox inset="0,0,0,0">
              <![endif]-->
                  <table cellpadding="0" cellspacing="0" align="center" class="main"
                      style="margin:0 auto; width: 660px; height: 25px; border-spacing: 0px;border-collapse: collapse;"
                      border="0" width="660" height="25">
                      <tbody>
                          <tr>
                              <td valign="center" style="margin: 0; padding:0; text-align:center;">
                                  <p
                                      style="line-height: 18px; padding: 0px; margin: 0px; font-size: 18px; color: #BD9A4B; text-align: center; font-family: Gilroy,Aria, Helvetica, sans-serif; font-weight:600;">
                                      Dear {{lead.First Name}},
                                  </p>
                              </td>
                          </tr>
                      </tbody>
                  </table>
                  <!--[if gte mso 9]>
              </v:textbox>
              </v:rect>
              <![endif]-->
              </td>
          </tr>