メールスタイルの管理 managing-styles

最終更新日： 2026年4月12日

作成対象：

電子メール Designerでは、エレメントを選択すると、選択したコンテンツの種類に固有のいくつかのオプションがSettings ペインに表示されます。これらのオプションを使用すると、メールのスタイルを簡単に変更できます。

要素の選択 selecting-an-element

電子メールDesigner インターフェイスでエレメントを選択するには、次のいずれかを実行します。

構造ツリーを参照すると、より正確に選択できます。次のいずれかを選択できます。

列を選択するには、次の操作も実行できます。

このセクションの例を参照してください。

メール内の要素を選択します。詳しくは、要素の選択を参照してください。
必要に応じて設定を調整します。選択した各要素には、異なる設定セットが用意されています。

背景の挿入、サイズの変更、水平方向または垂直方向の整列の変更、カラーの管理、パディングまたはマージンの追加などを行うことができます。

これを行うには、Settings ペインに表示されるオプションを使用するか、インラインスタイル属性を追加します。
コンテンツを保存します。

メールDesignerのインターフェイスでは、パディングとマージンの設定をすばやく調整できます。

Padding：この設定を使用すると、要素の境界線内にあるスペースを管理できます。

例：

Margin：この設定を使用すると、要素の境界線と次の要素の間のスペースを管理できます。

NOTE

選択（構造コンポーネント、列またはコンテンツコンポーネント）に応じて、結果は異なります。 Adobeでは、列レベルで Padding およびMargin パラメーターを設定することをお勧めします。

Paddingと Margin の両方で、ロックアイコンをクリックして、上下または左右のパラメーター間の同期を解除します。これにより、各パラメーターを個別に調整できます。

E メールデザイナーで背景を設定する際の推奨事項は次のとおりです。

使用可能な背景設定を次に示します。

メール全体に Background color を設定します。左側のパレットからアクセス可能なナビゲーションツリーで、本文の設定を必ず選択してください。
Viewport background colorを選択して、すべての構造コンポーネントに同じ背景色を設定します。このオプションを使用すると、背景色から別の設定を選択できます。
構造コンポーネントごとに異なる背景色を設定します。左側のパレットからアクセス可能なナビゲーションツリーで構造を選択し、その構造にのみ特定の背景色を適用します。

構造の背景色が隠れてしまう場合があるので、ビューポートの背景色を設定しないでください。

構造コンポーネントのコンテンツに Background image を設定します。

note
NOTE
一部のメールプログラムでは、背景画像はサポートされていません。サポートされていない場合は、代わりに行の背景色が使用されます。画像を表示できない場合は、必ず適切なフォールバックの背景色を選択してください。

列レベルで背景色を設定します。

note
NOTE
これは最も一般的な使用例です。アドビでは、メールコンテンツ全体を柔軟に編集できるように、背景色を列レベルで設定することをお勧めします。

また、列レベルで背景画像を設定することもできますが、ほとんど使用されません。

3つの列で構成される構造コンポーネント内のパディングと垂直方向の整列を調整します。これを行うには、次の手順に従います。

メール内で構造コンポーネントを直接選択するか、左側の パレット から利用できる構造ツリーを使用します。
コンテキストツールバーから、Select a columnをクリックし、編集するツールバーを選択します。構造ツリーから選択することもできます。

その列の編集可能なパラメーターは、右側のSettings ペインに表示されます。
Vertical alignmentで、Upを選択します。

コンテンツコンポーネントが列の上に表示されます。
Paddingで、列内の先頭のパディングを定義します。ロックアイコンをクリックして、下部のパディングとの同期を解除します。

その列の左右のパディングを定義します。
他の列の整列とパディングを調整する場合と同様に行います。
変更内容を保存します。