HTML電子メール：画像に透明な背景色を置き、その上にテキストを入れます

Question

透明な背景レイヤーにテキストがあり、背景レイヤーが画像上にあります。

私はHTML Emailerを作成しているので、background-imageのプロパティは使用できません。 imgタグを使用する必要があります。

どうすればいいですか？

<table> 
 
    <tr> 
 
    <td> 
 
     <img src="http://www.hubilo.com/eventApp/ws/images/event/cover/facebook/thumb/2712_1467715620.jpg" style="width: 600px; height: 300px;"> 
 
     </td> 
 
    </tr> 
 
</table>

私は、画像の上に透明の背景色層と背景色の層の上にいくつかのテキストをしたいです。

PS：div、positionは使用できません。 tableタグとインラインCSSのみに固執する必要があります。

ありがとうございます。

Answer 1

2つのテーブルを使用できます。

<table class="main-background" width="600px" cellspacing="0" cellpadding="0" border="0" bgcolor="#222325" align="center" style="border-collapse: collapse; mso-table-lspace: 0pt;mso-table-rspace: 0pt; background-repeat: no-repeat; background-size: cover;" background="http://www.hubilo.com/eventApp/ws/images/event/cover/facebook/thumb/2712_1467715620.jpg"> 
 
<tbody> 
 
<tr> 
 
<td height="300" valign="top" align="center" style="">        
 
    <table width="600" cellspacing="0" cellpadding="0" border="0" align="center" class="container" style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; background:rgba(245,86,26,0.4);"> 
 
    <tbody> <tr><td>Your Text</td></tr><tr><td>Your Text</td></tr><tr><td>Your Text</td></tr><tr><td>Your Text</td></tr></tbody></table> 
 
    </td></tr></tbody></table>

このコードを使用してみてください。