Gmail HTML电子邮件背景

时间:2012-03-19 09:57:46

标签: html css email gmail background-position

我正在处理HTML电子邮件。 我得到的问题是GMAIL不使用我提供的“背景位置”。 我有一张100%宽度的桌子,背景必须居中。大多数客户完美地做到这一点,但Gmail没有。有解决方法吗?

内联CSS是这样的:(我将所有背景属性分开,因为否则大多数客户端都没有以正确的方式显示它)

<table style="background-repeat: no-repeat; background-position: center top;" border="0" width="100%" align="center" bgcolor="#1E1411" background="assets/mainback2.jpg">

7 个答案:

答案 0 :(得分:22)

有可能,您只需将所有背景样式放在一行中,如下所示:

background:#1E1411 url(assets/mainback2.jpg) no-repeat center top;

但由于某些电子邮件客户端无法处理背景图像,因此您必须将颜色分开。

background:url(assets/mainback2.jpg) no-repeat center top;
background-color:#1E1411;

答案 1 :(得分:2)

你回答了自己的问题。

  

GMAIL不使用“background-position

article

答案 2 :(得分:0)

您可能不必单独在STYLE引号中定义背景。写得像这样:

<table style="background-repeat: no-repeat; background-position: center top; background-image:url(assets/mainback2.jpg)" border="0" width="100%" align="center" bgcolor="#1E1411">

答案 3 :(得分:0)

来自:http://css-tricks.com/using-css-in-html-emails-the-real-story/

你不能做什么:

包含带样式的部分。 Apple Mail.app支持它,但Gmail和Hotmail不支持,所以这是禁止的。 Hotmail将支持正文中的样式部分,但Gmail仍然不支持。

链接到外部样式表。没有多少电子邮件客户端支持这一点,最好忘记它。

背景图片/背景位置。 Gmail也是这个问题的罪魁祸首。 清除你的花车。再次使用Gmail。

保证金。是的,严重的是,Hotmail忽略了利润。基本上任何CSS定位都不起作用。

字体-任何东西。机会是Eudora会忽略你试图用字体声明的任何东西。 你还应该注意更多的事情。有关在线电子邮件服务支持的完整列表,请查看Xavier Frenette上的这篇文章。

所以,没有人可以做好友。

答案 4 :(得分:0)

将背景图片放在td上,

<td background="http://someimageurl" style="background-repeat:no-repeat">

然后将table放在align="center"的中心位置。将表same宽度作为背景以获得居中效果。以此为中心的解决方案但不适用于所有情况。

答案 5 :(得分:0)

如果我想在Gmail等客户端支持背景图片,我只需使用它:

http://www.campaignmonitor.com/blog/post/3170/adding-background-images-to-your-email-in-two-simple-steps/

答案 6 :(得分:0)

试试看看 http://zurb.com/,其HTML电子邮件适用于任何设备&amp;客户端。