27

次の HTML をメールで送信する PHP のスクリプトがあります。

<html class="no-js" lang="en">
   <body>
      <div style="width: 70%;background-color: #060b2b;margin: auto;flex-direction: column;display: flex;">

        <h1 style="margin-top: 50px;color: white;margin-left: auto;margin-right: auto;">Vous avez reçu une nouvelle notification.</h1>

        <div style="width: 80%;padding: 50px;margin-top: 50px;background-color: #222;margin-left: auto;margin-right: auto;display: flex;">
            <p style="color:white;margin: auto;text-align: center;">{{$notification}}</p>
        </div>

        <a href="" style="margin-top: 50px;margin-bottom: 50px;margin-left: auto;margin-right: auto;color: white;padding:15px;background-color: #0E0E0E;">Accéder à mon compte</a>
      </div>
   </body>
</html>

しかし、受信した電子メール (メイン div を調べたとき) にはプロパティが表示されませんflex-direction: column;

gmail がこれらのプロパティをフィルタリングしているようです。

これは正常ですか？

4

1 に答える 1

54

HTML 電子メールの設計は、HTML Web サイトの設計とは異なります。電子メール クライアントと Web ブラウザーの間には、大きな技術的ギャップがあります。ブラウザは進化し続けているようですが、電子メール クライアントは 1998 年のままです。

HTML 電子メールの世界では、埋め込みスタイルと外部スタイルは良くなく、CSS3 は良くなく、JavaScript は良くなく、インライン スタイルとレイアウト用のテーブルは良くあります。この世界では、昔ながらのコーディング手法が健在です。

Gmail が CSS3 プロパティを取り除くのは当然のことです。最善の策は、テーブルとインライン スタイルに固執することです。

更新: Gmail が埋め込みスタイルをサポートするようになりました。

詳しくは：

于 2016-09-07T18:28:07.870 に答える