background-imgを使用せずに電子メールテンプレートを作成しようとしています

Question

background-imageに問題があります。問題は、電子メールテンプレートで背景画像を使用できないことです。
<img>タグを使用できるこの問題を解決するには、画像の前にテキストを配置することが問題です。
私が知りたいのは、背景画像の使用を避け、<img>を使用し、上部にテキストを置くオプションがあるかどうかです。ここに私のコードは次のとおりです。

<table align="left" border="0" cellpadding="0" cellspacing="0" style="max-width:100%;min-width:100%;border-collapse:collapse;" width="100%" class="mcnTextContentContainer"> 
    <tbody> 
    <tr> 
     <td valign="top" class="mcnTextContent" style="padding-top:0;padding-right:18px;padding-bottom:9px;padding-left:18px;color:#808080;font-family:Helvetica;font-size:16px;line-height:150%;text-align:left;background-color: #003b5d;background:url('http://example.com/images/bg-hero.jpg');"> 
     <h2 class="null" style="text-align:center;height:100px;color:#FFF;display:block;margin:0;padding:0;font-family:Helvetica;font-size:34px;font-style:normal;font-weight:bold;line-height:150%;letter-spacing:normal;padding-top:50px;">A friendly message</h2> 
     </td> 
    </tr> 
    </tbody> 
</table> 

は、私が欲しいのは、コード

Answer 1

に背景画像background:url('http://example.com/images/bg-hero.jpg'); を置き換えるためにおそらく、このCSSはあなたを助けることができますです！私の電子メールテンプレートのために働いています。

body { 

background-image: url('http://example.com/images/bg-hero.jpg'); 

background-repeat: repeat-y no-repeat; 

background-color: #333; 

margin: 0; 

padding: 0; 

}