-2

HTML メールを送信していますが、 YahooHotmailGmailなどのメール クライアントによってメールの表示が異なります。タグを<style>使用してモバイル デバイスのメディア クエリを使用し、次にそのスタイル シートを使用して Yahoo と Hotmail を使用しました。

4

5 に答える 5

2

メール クライアントはすべて CSS を異なる方法で処理します。サポートするプロパティが異なり、一部を明示的に許可しない場合もあります。Web ブラウザーのスタイリングよりもはるかに困難です。

メールのデザインを作成するためのリソースを次に示します。

HTML メールで CSS を使用するためのガイド

さまざまなメール クライアントでの CSS サポートの表(@donald123 の回答から)

HTML メール テンプレート ビルダー(@cassi.lup の回答から)

モバイル デバイスのメールで CSS を最適化するためのガイド

Mailchimps メール テンプレート(@cassi.lup の回答から)

于 2012-09-05T08:09:18.747 に答える
1

次の 2 つのオプションがあります。

  1. 正しくフォーマットされたテンプレートから始めて、そこからデザインを進めてください。この問題で非常に役立つリソースは、このサービスです。ただし、CSS トリックに関しては非常に制限されていることに注意してください。
  2. 画像から HTML 形式のメールを作成します。そうすれば、使用しているデザイン要素が同様に解釈されるため、すべてのブラウザーで一貫性が保たれます。

別の便利なリソース: http://mailchimp.com/resources/html-email-templates/

于 2012-09-05T08:21:17.223 に答える
1

HTML メールの CSS はシンプルでなければならないことに注意してください。すべてのクライアントがすべての CSS スタイルを理解できるわけではありません :-(

たとえば、レイアウトにテーブルを使用することは、HTML メールでは適切な ID です ...

HTML メールのスクリプトを作成する最適な方法を Google で検索してみてください。主要なクライアントでの CSS スタイルの理解に関する簡単な概要は、ここで見つけることができます

主要なクライアントでの CSS スタイルの理解は、ここで見つけることができます

于 2012-09-05T08:09:46.670 に答える
0

個人的に、私は常にDoctypeなしでhtmlフィールドを作成します。次に、html、head、body の開始タグと終了タグだけです。次に、テーブルを使用し、インライン スタイルシートのみを使用します。また、私の経験では、テーブルの境界線、セルのパディング、およびマージンを削除することを忘れないでください。

スペースを埋めるには、表のセルを使用し、一部の電子メール クライアントはこれらを無視するため、パディングやマージンを使用しないでください。

そして何よりも重要です!背景を使用しないでください。多くの画像を使用しないようにしてください。ヘッダー、フッター、または製品画像などに使用します。

それが役立つことを願って、グラマーに申し訳ありません;)

于 2012-09-05T08:29:42.580 に答える
0

メールのスタイルについては、このサイトから理解を深めることができます。

于 2012-09-05T08:12:52.303 に答える