Question

我已经在这方面工作了几个小时，我不知道发生了什么。

我正在发送一封html电子邮件，我在底层div之间有一个很大的差距。

在浏览器中运行良好，只是在电子邮件中显示出奇怪的效果。＆＃39;前景＆＃39;

这是怎么回事？

＆＃13;

<!DOCTYPE html>
<html>
<head>
  <meta content="text/html; charset=utf-8" http-equiv="content-type">
  <title></title>
</head>
<body alink="#EE0000" link="#0000EE" style="color: rgb(0, 0, 0);" vlink="#551A8B">
  <div style="background-color: rgb(102, 102, 102);">
    <div style="background-color: white;">
      <br>
      <br>
      <br>
    </div>
    <div style="background-color: rgb(255, 102, 0);">
      <br>
    </div>
    <div style="background-color: rgb(51, 51, 51);">
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
    </div>
    <div style="background-color: rgb(102, 102, 102);">
      <br>
      <br>
      <br>
    </div>
  </div>
</body>
</html>

＆＃13;

Answer 1

首先，您需要将您的设计转换为<table>格式。大多数电子邮件客户端都支持HTML格式的电子邮件，而不是<div>。

将设计移至<table>形式时，请记住使用<span>标签而不是<p>标签。

以下是电子邮件模板示例

＆＃13;

<!DOCTYPE html>
<html>
<body>

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

</body>
</html>

＆＃13;

电子邮件中div之间的空白差距

1 个答案: