2017-06-27 26 views
2

私はphpファイルからメールをGmailアカウントに送信しています。 私が持っているコードは、基本的なHTMLとCSSです。 電子メールはデスクトップでうまく見えますが、すべてのスタイルがありますが、モバイル(アプリとブラウザの両方)ではスタイルが表示されないため、内部CSSが削除されているようです。Gmailの内部CSSがモバイルで動作しないのはなぜですか?

私でも試したグーグルのサンプルコード:

$headers = "MIME-Version: 1.0" . "\r\n"; 
$headers .= "From: Optimization Manager <[email protected]>" . "\r\n" . 
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n"; 

しかし、たとえこのdoesntの仕事:

<html> 
    <head> 
    <style> 
     .colored { 
     color: blue; 
     } 
     #body { 
     font-size: 14px; 
     } 
     @media screen and (min-width: 500px) { 
     .colored { 
      color:red; 
     } 
     } 
    </style> 
    </head> 
    <body> 
    <div id='body'> 
     <p>Hi Pierce,</p> 
     <p class='colored'> 
     This text is blue if the window width is 
     below 500px and red otherwise. 
     </p> 
     <p>Jerry</p> 
    </div> 
    </body> 
</html> 

これらが送信されます私のヘッダです。

アイデア?

+4

を教えて来た場合、私のシステムは、それは、また罰金と明確なキャッシュを動作するため、これは、それが動作するかもしれ適用します。また、電子メールテンプレートではインラインスタイルが適しています。もっと詳しくは、https://www.campaignmonitor.com/blog/email-marketing/2016/10/gmail-update-googles-rendering-refresh/ –

+0

かもしれないが、私はそれを間違って読むかもしれないが、あなたは内部のCSSを持つことができ、以前ははるかに少なくなっていると言っていますか? –

+0

これは私がコードを入手した場所です。彼らはこれを行う可能性があり、例を挙げても、私にはうまくいかないようです。https://developers.google.com/gmail/design/ css –

答えて

-1

はまだ問題が、その後、私はGmailのほとんどすべてを取り除き

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>sdb</title> 
 
    <style> 
 
    .colored { 
 
     color: red; 
 
    } 
 
    
 
    #body { 
 
     font-size: 14px; 
 
    } 
 
    
 
    @media screen and (max-width: 500px) { 
 
     .colored { 
 
     color: blue; 
 
     } 
 
    } 
 
    </style> 
 
</head> 
 

 
<body> 
 

 
    <div id='body'> 
 
    <p>Hi Pierce,</p> 
 
    <p class='colored'> 
 
     This text is blue if the window width is below 500px and red otherwise. 
 
    </p> 
 
    <p>Jerry</p> 
 
    </div> 
 

 
    </script> 
 
</body> 
 

 
</html>

+0

ありがとうございましたが、それは助けにならなかった、私はキャッシュをクリアし、あなたのコードを追加しました。 –

関連する問題