How make background image on newsletter in outlook

2019-01-03 09:51发布

I'm trying to make newsletter where I have some image as background and text on it. This is easy but I need this to work on Ms Outlook.

What I have tried:

1.

<td width="100" height="100" style="background: url('someurl');">text</td>

2.

<td width="100" height="100" background="someurl">text</td>

3.

<td width="100" height="100">
    <div style="width: 0px; height:0px; position: relative;">
        <div style="width: 100px; height: 100px; position: absolute; background: url('someurl')">
           text
        </div>
    </div>
</td>

But nothing works well on outlook. I have no idea how fix it. I'm using outlook 2007.

Any help would be appreciated.

10条回答
萌系小妹纸
2楼-- · 2019-01-03 10:33

UP

Powerful tool for "Bulletproof Email Background Images" (VML for Outlook 2007/2010/2013, and HTML/CSS for Outlook 2000/2003, Gmail, Hotmail...)

http://emailbg.net

as an exemple :

    <div style="background-color:#f6f6f6;">
  <!--[if gte mso 9]>
  <v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
    <v:fill type="tile" src="http://i.imgur.com/n8Q6f.png" color="#f6f6f6"/>
  </v:background>
  <![endif]-->
  <table height="100%" width="100%" cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td valign="top" align="left" background="http://i.imgur.com/n8Q6f.png">

and

      </td>
    </tr>
  </table>
</div>

in order to have the specified background image to Full email body.

This link help to use the Vector Markup Language (VML)

msdn.microsoft.com/en-us/library/bb264137%28v=vs.85%29.aspx

www.w3.org/TR/NOTE-VML#_Toc416858389

查看更多
来,给爷笑一个
3楼-- · 2019-01-03 10:37

Background image is not supported in Outlook. You have to use an image and position it behind the text using position relative or absolute.

查看更多
【Aperson】
4楼-- · 2019-01-03 10:43

You can use it only in body tag or in tables. Something like this:

<table width="100%" background="YOUR_IMAGE_URL" style="STYLES YOU WANT (i.e. background-repeat)">

This worked for me.

查看更多
登录 后发表回答