Как отключить отображение текста из другой таблицы на картинке html код электронной почты - PullRequest
Новая
       129

Как отключить отображение текста из другой таблицы на картинке html код электронной почты

0 голосов
/ 07 августа 2020

Итак, я помещаю изображение в первую таблицу в абсолютную позицию, чтобы текст отображался над ним, но проблема, с которой я сейчас сталкиваюсь, заключается в том, что таблица под текстом также появляется на изображении. Как мне этого избежать? 

<tr>
  <td>
    <table width="100%" cellspacing="0" cellpadding="0" border="0" style="">
      <tr>
        <td>
          <img src="img/suit1.jpeg" width="590px;" height="500px;" style="position:absolute">
          <h1>each</h1>
          <button>SHOP Now</button>
        </td>
      </tr>
    </table>
  </td>
</tr>
<!-- end of row 3 -->
<!-- start of row 4-->
<tr>
  <td>
    <table width="100%" cellspacing="0" cellpadding="0" border="0" style="">
      <tr>
        <td>
          <h1>hello</h1>
        </td>
      </tr>
    </table>
  </td>
</tr>

1 Ответ

0 голосов
/ 07 августа 2020

Попробуйте применить position: absolute к текстовым элементам. В моем решении я заключил текст в div и применил свойство position: absolute. Кроме того, я применил position: relative к parent element как изображения, так и текста. 

<tr>
  <td>
    <table width="100%" cellspacing="0" cellpadding="0" border="0" style="">
      <tr>
        <td style="position:relative;">
          <img src="img/suit1.jpeg" width="590px;" height="500px;">
          <div style="position:absolute; top: 0; left: 10px;">
            <h1>each</h1>
            <button>SHOP Now</button>
          </div>
        </td>
      </tr>
    </table>
  </td>
</tr>
<!-- end of row 3 -->
<!-- start of row 4-->
<tr>
  <td>
    <table width="100%" cellspacing="0" cellpadding="0" border="0" style="">
      <tr>
        <td>
          <h1>hello</h1>
        </td>
      </tr>
    </table>
  </td>
</tr>
...