HTML电子邮件:在图像和文本上放置透明背景颜色

时间:2016-09-02 09:52:22

标签: html css html-table

我想在透明背景图层上有一个文字,背景图层在图像上。

在制作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:我无法使用divposition。必须坚持table代码和内联css

谢谢。

1 个答案:

答案 0 :(得分:0)

您可以使用两个表格。

  <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>

尝试使用此代码。