Question

我在创建防弹背景图像方面遇到了这个非常奇怪的问题，这件事让我疯狂。

问题：

有两个可变内容块，它们包含使Outlook 2013和Windows 10 Mail上显示背景图像的代码。
当背景图像显示时，创建的v：rect似乎拒绝占用它所应该的800像素宽度。有关它在Microsoft Outlook 2013中的外观的演示，请参阅附件。
它在Outlook 2010中显示正常。

第一个区块的代码（为了简洁，它与第二个区块的问题相同）：

<!-- // Begin Module: Welcome Block \\ -->
        <table align="center" border="0" cellpadding="0" cellspacing="0" class="wrapper_table" mc:repeatable="layout" mc:variant="Welcome Block" >
          <tbody>
            <tr>
              <td bgcolor="#3b3f40" style="background:rgb(59,63,64) url('https://gallery.mailchimp.com/0728d953751ef38036e722a85/images/0ecfdaa9-07ef-4f83-8e45-ef4ed827bcb0.jpg'); background-repeat:no-repeat; background-position: center top 100% 100%; background-size: 100% 100%; width:800px; max-width:800px;">

                  <!--[if gte mso 9]>
                  <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:800px; height:340px; mso-position-horizontal:center;">
                    <v:fill type="frame" src="https://gallery.mailchimp.com/0728d953751ef38036e722a85/images/0ecfdaa9-07ef-4f83-8e45-ef4ed827bcb0.jpg" color="#3b3f40" />
                    <v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">
                  <![endif]--><div>
                <table cellpadding="0" cellspacing="0" border="0">
                  <tbody>
                    <tr>
                      <td class="content" style="width:800px;">
                        <table cellspacing="0" cellpadding="0" border="0" width="100%">
                          <tbody>
                            <tr>
                              <td class="padding" style="width:20px;">
                              </td>
                              <td class="content_row" align="center" style="width:760px;">
                                <table cellpadding="0" cellspacing="0" border="0" align="center" width="100%" class="mobile_centered_table">
                                  <tbody>
                                    <tr>
                                      <td class="section_h" height="90">
                                      </td>
                                    </tr>
                                    <tr>
                                      <td class="content_row" valign="top" align="center" style="color:#ffffff;font-family:Montserrat, Arial, sans-serif;font-size:36px;font-weight:700;line-height:36px;text-transform:uppercase;width:760px;">
                                        <span class="white_text" mc:edit="welcome_header"> WELCOME TO ULTIMAIL </span>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td height="15" class="space_class" style="font-size:1px;line-height:1px;"> 
                                      </td>
                                    </tr>
                                    <tr>
                                      <td class="white_text" align="center" style="color:#ffffff;font-family:Montserrat, Arial, sans-serif;font-size:16px;font-weight:400;line-height:24px;width:760px;" mc:hideable mc:edit="welcome_subheader">
                                        Curabitur et ligula. Ut molestie a, ultricies porta urn vestibulum commodo
                                      </td>
                                    </tr>
                                    <tr>
                                      <td height="30" colspan="3">
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" align="center">
                                        <table cellspacing="0" cellpadding="0" border="0">
                                          <tbody>
                                            <tr>
                                              <td bgcolor="#0d793d" class="button blue_button" align="center" width="160" height="45" style="border-radius:100px;display:block;background-color:#0d793d;border-color:rgb(57,57,57);border-width:0px;" mc:hideable mc:edit="a9">
                                                <table cellspacing="0" cellpadding="0" border="0">
                                                  <tbody>
                                                    <tr>
                                                      <td style="color:#ffffff;font-family:Montserrat, Arial, sans-serif;font-size:14px;font-weight:400;text-align:center;text-transform:uppercase;" align="center">
                                                        <a class="white_text" href="#" target="_blank" style="color:#ffffff;display:block;line-height:45px;text-decoration:none;width:100%;">
                                                          read more
                                                        </a>
                                                      </td>
                                                    </tr>
                                                  </tbody>
                                                </table>
                                              </td>
                                            </tr>
                                          </tbody>
                                        </table>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                              <td class="padding" style="width:20px;">
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                    <tr>
                      <td height="40">
                      </td>
                    </tr>
                    <tr>
                      <td height="45" class="nomobile">
                      </td>
                    </tr>
                  </tbody>
                </table></div>
                <!--[if gte mso 9]>
              </v:textbox>
            </v:rect>
            <![endif]-->
              </td>
            </tr>
          </tbody>
        </table>
        <!-- // End Module: Welcome Block \\ -->

在Outlook 2013中看到它出现故障：https://i.stack.imgur.com/mwTKx.png 在Windows Mail 10中查看它的故障：https://i.stack.imgur.com/bXczG.png

Outlook和Windows Mail中的背景图像无法完全拉伸

0 个答案: