电子邮件签名-标头横幅

时间:2019-04-09 11:52:17

标签: html css email outlook html-email

我正在尝试在电子邮件中添加标题。这将是一幅图像,而我希望其显示的方式将是[横幅] [电子邮件正文] [签名]

但是问题是图像显示时在其上方有两个空行,而光标位于第一行。这是在Outlook中。

如果有人知道如何解决此问题,我将不胜感激。

P.S。我也需要在Thunderbird中使用它。

我创建了三个div块,一个用于横幅,一个用于电子邮件正文,一个用于签名,中间div块中有一个空的段落行。我以为这是行得通的,但是没有...

<div>
<table class=MsoNormalTable width='100%' role='presentation' cellpadding=0 cellspacing=0 border=0 style='background: none;border-width: 0;margin: 0;mso-padding-alt: 0 0 0 0; padding: 0 0 0 0;'>
        <tbody>
            <tr valign='middle'>
                <td valign='middle'>
                    <a href='https://google.com' style='text-decoration: none;'>
                        <img src='xxx' width=720 height=74 name='Banner' style='vertical-align: middle;display:block;' alt=''/>
                    </a>
                </td>
            </tr>
        </tbody>
</table>
</div>

<div style='background: none; mso-padding-alt: 15px 0 0 0; padding:15px 0 0 0;'>
<p> </p>
</div>

1 个答案:

答案 0 :(得分:1)

.demo
{
   	border:1px solid black;
}
<div class="banner-div">
<table class="MsoNormalTable" width='100%' role='presentation' cellpadding=0 cellspacing=0 border=2 style='background: none;border-width: 0;margin: 0;mso-padding-alt: 0 0 0 0; padding: 0 0 0 0;'>
    <tbody  class="demo">
		<tr valign='middle'>
		   <td valign='middle'>
		       <a href='https://google.com' style='text-decoration: none;'>
		          <img src='demoimg.jpg' width=100% height="400px;" name='Banner' style='vertical-align: middle;display:block;' alt='banner here...'/>
		       </a>
		   </td>
		</tr>
		<tr>
		   <td>
		      <h2>email body here.....</h2>
		   </td>
                </tr>
</tbody>
  </table>
</div>
<div class="signature demo" style='background: none; mso-padding-alt: 15px 0 0 0; padding:15px 0 0 0;'>
<p>signature here....</p>
</div>

我认为您的问题已通过更新width =“ 100%”解决,并为电子邮件正文添加了第二个tr标签