Outlook 移动版本的电子邮件模板开发

Outlook 移动版本的电子邮件模板开发,outlook,email-client,email-templates,Outlook,Email Client,Email Templates,我正试图开发一个电子邮件模板的图像评级。我正在使用表格布局,以便它在outlook中工作 我使用了表格布局。但是第一个td标签比另一个td标签使用更多的宽度 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta n

我正试图开发一个电子邮件模板的图像评级。我正在使用表格布局,以便它在outlook中工作

我使用了表格布局。但是第一个td标签比另一个td标签使用更多的宽度

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

  <head>
    <meta name="viewport" content="width=device-width;initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  </head>

  <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="padding:10px;color:#616161;font-size:13pt;font-family: Arial, Helvetica, sans-serif;">
    <table cellpadding="0" cellspacing="0" border="0" valign="top" style="width:100%;background-color:#f7f7f7;border:1px solid #e7e7e7;border-radius:5px;">
      <tr>
        <td style="padding:15px 10px;">Hi {{ticket.requester.first_name}},</td>
      </tr>
      <tr>
        <td style="padding:15px 10px;">Your support ticket, <b>'{{ticket.id}}:{{ticket.title}}'</b>, was recently marked as resolved and we'd love to hear how you would rate your experience.</td>
      </tr>
      <tr>
        <td style="padding:15px 10px;">Your feedback plays a key role in helping us understand what we're doing well and where improvements can be made. Help us to better help you by answering the following question:</td>
      </tr>
      <tr>
        <td style="padding:30px 15px;">How would you rate the support you received?</br>Use the scale below to indicate how satisfied you were with your overall experience,</td>
      </tr>
      <tr style="">
        <td align="center" style="">
          <a href="https://www.onepointsurveys.com/x/?sid=8ompJlgDM9C7l7cuONjG&user1=1" target="_blank" class="link_visit" onMouseOver=" this.style.color='#616161'" onmouseout="this.style.color='#fff'"><img width="40" src="http://www.onepointglobal.com/Images/Outstanding.png" alt="1" /></a>
          <div style="font-weight:normal;font-size: 11px;margin: 10px 0;">Outstanding</div>
        </td>
        <td align="center">
          <a href="https://www.onepointsurveys.com/x/?sid=8ompJlgDM9C7l7cuONjG&user1=1" target="_blank" onMouseOver="this.style.color='#616161'" onmouseout="this.style.color='#fff'"><img width="40" src="http://www.onepointglobal.com/Images/Good,I'm%20satisfied.png" alt="2" /></a>
          <div style="font-weight:normal;font-size: 11px;margin: 10px 0;">Satisfied</div>
        </td>
        <td align="center" style="">
          <a href="https://www.onepointsurveys.com/x/?sid=8ompJlgDM9C7l7cuONjG&user1=1" target="_blank" style="color:#fff;padding:2px;text-decoration:none;font-size:22px;" onMouseOver=" this.style.color='#616161'" onmouseout="this.style.color='#fff'"><img width="40" src="http://www.onepointglobal.com/Images/Could%20be%20better.png" alt="3" /></a>
          <div style="font-weight:normal;font-size: 11px;margin: 10px 0;text-align:center;">Better</div>
        </td>
        <td align="center" style="">
          <a href="https://www.onepointsurveys.com/x/?sid=8ompJlgDM9C7l7cuONjG&user1=1" target="_blank" onMouseOver=" this.style.color='#616161'" onmouseout="this.style.color='#fff'"><img width="40px" src="http://www.onepointglobal.com/Images/Bad,I'm%20unsatisfied.png" alt="4" /></a>
          <div style="font-weight:normal;font-size: 11px;margin: 10px 0;">Unsatisfied</div>
        </td>
      </tr>
      <tr>
        <td style="padding:30px 15px;">We've included a reminder of what your ticket was about.</td>
      </tr>
      <tr>
        <td style="padding:0 25px;">
          <hr style="border-top:1px solid #e7e7e7;">
        </td>
      </tr>
      <tr>
        <td style="padding:25px;"><img src="http://www.onepointglobal.com/Images/logo-footer.png" alt="onepoint_logo"></td>
      </tr>
    </table>
  </body>

</html>

你好{{票证。请求者。名字},
您的支持票证“{ticket.id}:{{ticket.title}}”,最近被标记为已解决,我们很想听听您如何评价您的体验。
您的反馈在帮助我们了解哪些方面做得好,哪些方面可以改进方面起着关键作用。通过回答以下问题,帮助我们更好地帮助您:
您如何评价您获得的支持?
使用下面的量表来表示您对总体体验的满意度, 杰出的 满意的 更好 不满意 我们已经包括了一个关于你的机票的提醒。
附加相同的html。有人能告诉我为什么代码中的表列表不能正常工作吗


非常感谢。

以防有人面临同样的问题。原因是表未使用colspan选项正确构造。一行有四个单元格,另一行只有一个标记,并且图像的宽度、高度和对齐方式应作为元素属性(宽度、高度、valign、halignb)而不是样式属性给出。。因为第四行有四个td单元格,所以我必须为表的第一个td添加colspan=“4”,第四行应该在另一个表标记中。以防万一,任何人都会遇到同样的问题。原因是表未使用colspan选项正确构造。一行有四个单元格,另一行只有一个标记,并且图像的宽度、高度和对齐方式应作为元素属性(宽度、高度、valign、halignb)而不是样式属性给出。。因为第四行有四个td单元格,所以我必须为表的第一个td添加colspan=“4”,第四行应该在另一个表标记内。