2017-11-12 9 views
1

メールテンプレートを作成していますが、主にインラインCSSを使用していますが、このメールをGmailで受信したときにインラインCSSが動作しない場所もあります。それはyahooでは完璧に動作していますが、Gmailでは動作しません。
はここGmailのブロックインラインCSSプロパティ

<div class="etitle" style="float:left; padding-top:5px; width:58%; margin-left:20px;"> 

これらのCSSプロパティは、mailchimpでも、ブラウザで作業している例ですが、私はその後、電子メールを送信するときに、これらのCSSプロパティは、Gmailで動作していません。 GmailがこれらのCSSプロパティをブロックするのはなぜですか?
これに関する少しのガイダンスは必要ありません

+0

Gmailクライアントで行った設定ではないことを確認しましたか? –

+0

はい、チェックして、運がない他のGmailアカウントでもこのテンプレートをテストします – Awan

答えて

1

インラインブロックと標準CSSを使用してGmailに送信されるメールのスタイルを設定できます。ほとんどのCSSセレクタ、属性、メディアクエリがサポートされています。サポートされていないCSSのプロパティとセレクタはGmailでは無視されます。

supported CSS properties and queriesの完全なリストについては、リファレンスガイドを参照してください。

<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> 

参照:地球上で最も人気のあるモバイル、Webおよびデスクトップ電子メールクライアントのためのcomplete breakdown of the CSS support(キャンペーン・モニターから)。

+0

ありがとう、あなたの答えと助けをありがとう、しかし私はまだインラインCSSが動作しない理由を考えています。いくつかの場所では動作していますが、少しではありません – Awan

+0

私の経験では、すべてのクライアントが異なって動作するため、インラインスタイルが常に機能するとは限りません。 Gmailの公式の指示に従うことをお勧めします。 – Nick

+0

私はそれを試みます。ありがとうございました! – Awan