Html Outlook新闻稿背景图像和文本

我在向时事通讯中的TD添加文本和背景图像时遇到了一些困难，在我用来显示它们的代码下面。背景可见，但未显示文本

       {if !empty($aModules.mkNews)}
            {foreach name=mkNews from=$aModules.mkNews item=mkNews}
                 <td width="230" style="background:url(http://www.example.com/images/content/mkNews/{$mkNews.mkNewsID}/image_{$mkNews.image|getImage:'_big'}) no-repeat center center; text-align: center; font-size: 14px; color: white; font-family:verdana; padding: 20px 0; line-height:22px;">
                     <table background="http://www.example.com/images/content/mkNews/{$mkNews.mkNewsID}/image_{$mkNews.image|getImage:'_big'}" width="230" height="230">
                         <tr>
                             <td style="text-align: center; font-size: 14px; color: white; font-family:verdana; padding: 20px 0; line-height:22px;">
                             <!--[if gte mso 9]>
                             <v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style='behavior: url(#default#VML); display:inline-block; height:230px; width:230px; border:0; z-index:1;' src="http://www.example.com/images/content/mkNews/{$mkNews.mkNewsID}/image_{$mkNews.image|getImage:'_big'}"/>
                             <v:shape xmlns:v="urn:schemas-microsoft-com:vml" id="theText" style='behavior: url(#default#VML); display:inline-block; position:absolute; height:230px; width:230px; top:0; left:0; border:0; z-index:2;'>
                             <![endif]-->
                             {$mkNews.message}
                             <!--[if gte mso 9]>
                             </v:shape>
                             <![endif]-->
                             </td>
                         </tr>
                     </table>
                 </td>
             {/foreach}
         {/if}

{if！empty（$aModules.mkNews）}
{foreach name=mkNews from=$aModules.mkNews item=mkNews}
{$mkNews.message}
{/foreach}
{/if}

谁能给我指出正确的方向吗？我对outlook使用的v型标签没有太多经验

---

提前谢谢

Outlook 2007和2010不支持背景图像。查看CSS支持

---

虽然上述内容适用于CSS，但Campaign Monitor提到了一个类似于您尝试的解决方案。他们使用不同的元素，试试看

<td bgcolor="#DDDDDD" style="background-image: url('http://www.example.com/images/content/mkNews/{$mkNews.mkNewsID}/image_{$mkNews.image|getImage:'_big'}');" background="http://www.example.com/images/content/mkNews/{$mkNews.mkNewsID}/image_{$mkNews.image|getImage:'_big'}" width="230" height="230" valign="top">
    <!--[if gte mso 9]>
       <v:rect style="height:230px; width:230px;border:0;" strokecolor="none">
          <v:fill type="tile" color="#DDDDDD" src="http://www.example.com/images/content/mkNews/{$mkNews.mkNewsID}/image_{$mkNews.image|getImage:'_big'}" /></v:fill>
       </v:rect>
       <v:shape id="theText" style="position:absolute;width:230px;height:230px;">
       <![endif]-->
    <p>If you can see this over the image, background images are successful.</p>
    <!--[if gte mso 9]>
       </v:shape>
    <![endif]-->
</td>

如果你能在图片上看到这一点，背景图片就是成功的

我已将大小和URL更改为您所需的大小和src

他们还将

xmlns:v=“urn:schemas microsoft com:vml

部分添加到

标记，而不是

v

标记

---

谢谢你的帮助，我找到了答案

以下代码起作用，文本可见

    <!--[if gte mso 9]>
        <v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style='behavior: url(#default#VML); display:inline-block; height:230px; width:230px; border:0; z-index:1;' src="http://www.example.com/images/content/mkNews/{$mkNews.mkNewsID}/image_{$mkNews.image|getImage:'_big'}"/>
        <v:shape xmlns:v="urn:schemas-microsoft-com:vml" id="theText" style='behavior: url(#default#VML); display:inline-block; position:absolute; height:230px; width:230px; top:-20px; left:0; border:0; z-index:2;'>
        <![endif]-->
        <table width="230" height="230" border="0" cellspacing="0" cellpadding="0">
            <tr height="230">
                <td width="230" style="text-align: center; font-size: 14px; color: white; font-family:verdana; line-height:22px;">{$mkNews.message|convertEncoding:'utf8_decode'|regex_replace:"/[\]/":""}</td>
            </tr>
        </table>
        <!--[if gte mso 9]>
        </v:shape>
        <![endif]-->


{$mkNews.message | convertEncoding:'utf8_decode'| regex_replace:“/[\ï»”/”：“”

文本应该在一个额外的表格中，然后在outlook 2010中可见。
背景图像在outlook 2010中工作，只有文本不可见。您看过了吗？它们似乎没有使用
v:image
，而是使用类似的
v:rect
和
v:fill
元素。