基于HTML的电子邮件不显示在Hotmail和Gmail中

我有一个简单的电子邮件，其正文为HTML。基于HTML的电子邮件不显示在Hotmail和Gmail中

这是一个简单的HTML：

<html> 
    <head> 
    <meta charset="utf-8"> 
    <link href="http://fonts.googleapis.com/css?family=Titillium+Web:200,300,400,600" rel="stylesheet" type="text/css"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <style> 
     .ticket_holder { 
     width:800px; 
     height:480px; 
     background-image:url(http://www.domain.com/img/sorteos/billete_sorteo_24-07-2015.jpg); 
     float:left; 
     margin:10px auto; 
     position:relative; 
     } 
     .ticket_number { 
     width:277px; 
     height:60px; 
     text-align:center; 
     position:absolute; 
     top:290px; 
     left:450px; 
     font-size:42px; 
     color:#11AA00; 
     font-family: Titillium Web, sans-serif; 
     font-weight:bold; 
     } 
    </style> 
    </head> 
    <body> 
    <div class="ticket_holder"> 
     <div class="ticket_number">0236</div> 
    </div> 
    </body> 
</html>

现在，我将展示从Gmail帐户得到电子邮件的内容。我认为必须有一个与标题相关的问题，但不知道它应该是什么。

Received-SPF: pass (google.com: domain of [email protected]mandrillapp.com designates 198.2.136.7 as permitted sender) client-ip=198.2.136.7; 
h=From:Sender:Subject:Reply-To:To:Message-Id:Date:MIME-Version:Content-Type; [email protected]; 
bh=QTHxKn1Liqi9ZJNIUiIqQFl0DNg=; 
b=Wep3W+aIvU17Xwa1SNM0he9Bf403lXYidvKGtwiZpb9QrccWY0DBqImsEqnEGNBKMdSpTd/MdyYW 
    k2bgPf/yqHdwNXPDsqS3naEEs/gJC7dfIU+2zvGKp2fpGKsKyzhHkWITEMKV5DoMs3WPNKEPxopx 
    l7GY4JpTaaSm7f+4B3M= 
DomainKey-Signature: a=rsa-sha1; c=nofws; q=dns; s=mandrill; d=mail136-7.atl41.mandrillapp.com; 
b=JIWGJJlHUZt5grcY4at3yqUabbvCI/KrS/VNplK+n+Ty9cDuCQQEANkExNamBojv+SMXsL8URPnl 
    igpbzKkhUk1WEvjufNYp6pZxAPkjHljuLpA+XdnYlgjCzvWJ4gI1QRuq3v5OeXxP6fcebsMSJrhn 
    rKWFKYfrMCpZx8v4NXk=; 
Received: from pmta04.mandrill.prod.atl01.rsglab.com (127.0.0.1) by mail136-7.atl41.mandrillapp.com id hk0cao1sb1ko for <[email protected]>; Fri, 10 Jul 2015 19:09:11 +0000 (envelope-from <[email protected]mandrillapp.com>) 
DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=mandrillapp.com; 
[email protected]; q=dns/txt; s=mandrill; t=1436555350; h=From : 
Sender : Subject : Reply-To : To : Message-Id : Date : MIME-Version : 
Content-Type : From : Subject : Date : X-Mandrill-User : 
List-Unsubscribe; bh=N1DazcpdS55HBslvogsYDTv2iLdRO0rnUDZkh9PCbtQ=; 
b=OjcMKaAC4K4s1I3fpjFwqMGbYcayh7661XLVARyfmap3g1zZMW/+FWtGU2rzKrIF7wNbtC 
+4E06pOycBBa7Q/D6BGk8CtLQLtWBe260o9X7d4gvBAl70/t0zyqbkucPx82AKzXe956cwsB 
wiBB9xxxmgQdq/LJsmax3b1/+ZRWk= 
From: "Contacto impresoras3d.com" <[email protected]> 
Sender: "Contacto impresoras3d.com" <[email protected]> 
Subject: =?utf-8?Q?Combinaci=C3=B3n=20Sorteo=2024/07/2015?= 
Return-Path: <[email protected]mandrillapp.com> 
Received: from [188.165.162.97] by mandrillapp.com id 94c0ce7842b842caaa20ee481b5d5bda; Fri, 10 Jul 2015 19:09:10 +0000 
Reply-To: <[email protected]> 
To: <[email protected]> 
X-Report-Abuse: Please forward a copy of this message, including all headers, to [email protected] 
X-Report-Abuse: You can also report abuse here: http://mandrillapp.com/contact/abuse?id=30672132.94c0ce7842b842caaa20ee481b5d5bda 
X-Mandrill-User: md_30672132 
Message-Id: <[email protected]mandrillapp.com> 
Date: Fri, 10 Jul 2015 19:09:10 +0000 
MIME-Version: 1.0 
Content-Type: multipart/alternative; boundary="_av-M8imh9jmVCY5HVEL4ea0TA" 

--_av-M8imh9jmVCY5HVEL4ea0TA 
Content-Type: text/plain; charset=utf-8 
Content-Transfer-Encoding: 7bit 

     0236 
--_av-M8imh9jmVCY5HVEL4ea0TA 
Content-Type: text/html; charset=utf-8 
Content-Transfer-Encoding: 7bit 

<html> 
         <head> 
          <meta charset="utf-8"> 
           <link href="http://fonts.googleapis.com/css?family=Titillium+Web:200,300,400,600" rel="stylesheet" type="text/css"> 
          <meta name="viewport" content="width=device-width, initial-scale=1"> 
         <style> 
         .ticket_holder { 
           width:800px; 
           height:480px; 
           background-image:url(http://www.impresoras3d.com/img/sorteos/billete_sorteo_24-07-2015.jpg); 
           float:left; 
           margin:10px auto; 
           position:relative; 
         } 
         .ticket_number { 
           width:277px; 
           height:60px; 
           text-align:center; 
           position:absolute; 
           top:290px; 
           left:450px; 
           font-size:42px; 
           color:#11AA00; 
           font-family: Titillium Web, sans-serif; 
           font-weight:bold; 
         } 
         </style> 
         </head> 

         <body> 
           <div class="ticket_holder"> 
             <div class="ticket_number">0236</div> 
           </div> 
         <img src="http://mandrillapp.com/track/open.php?u=30672132&id=94c0ce7842b842caaa20ee481b5d5bda" height="1" width="1"></body> 
         </html> 
--_av-M8imh9jmVCY5HVEL4ea0TA--

来源

2015-07-10 Apalabrados

您不应该在电子邮件中包含外部样式表，并且不应该使用css样式块。 – davidcondrey

可以使用CSS样式块，并且应该用于支持它的电子邮件客户端。而且，对于那些不支持样式块的电子邮件客户端，CSS也应该内联。 – ja408

Gmail剥离了头标签，许多电子邮件客户端对div标签的样式提供有限的支持。你最好的选择是将div转换为表格并内联样式。对于CSS兼容性，请参阅here;对于内嵌者，请参阅here。

来源

2015-07-10 20:33:31 Gortonington

基于HTML的电子邮件不显示在Hotmail和Gmail中

回答

相关问题