Question

我设置了background image in email templates。向Gmail发送电子邮件但在yahoo打开电子邮件时，此功能正常。不显示背景图像。

在雅虎电子邮件中显示图片的任何特定设置。

在我的电子邮件模板代码下面。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body style="background: url(http://domain.com/images/abc.jpg) top; background-size:cover;">
    <div class="abc">
        <p>Hello,</p>
        <p></p>
        <p>Welcome</p>
        <p>Thanks</p>
    </div>
</body>
</html>

任何人都有相关经验。

Answer 1

我得到了window。

solution

我在<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> <div class="abc" style="background-image: url(http://domain.com/images/abc.jpg); background-size:cover;"> <p>Hello,</p> <p></p> <p>Welcome</p> <p>Thanks</p> </div> </body> </html>中收到了完美的电子邮件。

谢谢谁试图解决我的问题。

Answer 2

对于Yahoo来说，关键是url使用单引号（或者如果您在单引号中包含属性，则可能使用双引号）。

因此必须是：

<body style="background: url('http://example.com/images/abc.jpg') top;">
  ...
</body>

在网址中没有单引号的情况下，Yahoo解析器将拒绝此位。

Answer 3

您在style属性中有引号需要转义或更改为单引号。

style="background: url('http://domain.com/images/abc.jpg') top; background-size:cover;"

Answer 4

在HTML中添加背景图片的方法有很多种。在为所有电子邮件客户端（甚至是Outlook）编写背景图像时，我的代码曾经有很多后备。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body background="http://domain.com/images/abc.jpg" style="background: url('http://domain.com/images/abc.jpg') top; background-image:url('http://domain.com/images/abc.jpg');">
    <div class="abc">
        <p>Hello,</p>
        <p></p>
        <p>Welcome</p>
        <p>Thanks</p>
    </div>
</body>
</html>

我认为你要找的那个是背景图像。

干杯

Answer 5

目前，您可以将其设置为Yahoo 和 Outlook以及Gmail。请务必添加绝对图像路径。在Outlook 2016上测试过，无法分辨早期版本。

以下是一个例子：

<div style="width: 300px;
height: 42px;
background: url('ribbon.png') no-repeat transparent;
margin: 0 auto;">
    <!--[if gte mso 9]>
    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:300px;height:42px;">
        <v:fill type="tile" src="ribbon.png" color="#7bceeb" />
        <v:textbox inset="0,0,0,0">
    <![endif]-->
    <div>
         Some text for the div, that has BG behind it.
    </div>
    <!--[if gte mso 9]>
    </v:textbox>
    </v:rect>
    <![endif]-->
</div>

在雅虎电子邮件中设置背景图片的问题

5 个答案: