2

因此，我正在为一家公司发送 html 邮件，但在使用 Outlook 2003 时遇到了一些问题。

如果我使用元素检查器将 html 注入到 gmail 中，或者使用 Thunderbird 将 html 插入，我完全没有问题。一切都正确发送，一切都被正确读取。在许多 html 电子邮件检查器上测试 html 并获得 100% 的兼容性。客户端使用 Outlook 2003 编辑内容并发送邮件。

这是代码：

<html xmlns="http://www.w3.org/1999/xhtml" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Agenda</title>
</head>
<body style="margin: 0;padding: 0;font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px">
<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0" style="border-collapse:collapse">
  <tr>
    <td width="200" align="center" valign="top" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table border="0" align="center" cellpadding="0" cellspacing="0" style="border-collapse:collapse">
        <tr>
          <td width="200" height="1600"><img src="http://www.oa.pt/Conteudos/Media/file.aspx?ida=132727" alt="Header" width="200" height="1600" style="display: block" /></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#ffffff"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#89181a"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#ffffff"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#89181a"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#ffffff"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#89181a"></td>
        </tr>
      </table></td>
    <td width="600" align="center" valign="top" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td width="600" height="200"><img src="http://www.oa.pt/Conteudos/Media/file.aspx?ida=132725" alt="Header" width="600" height="200" style="display: block" /></td>
      </tr>
      <tr>
        <td height="618" align="center" valign="top" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
              <td width="600" height="30" align="center" valign="top" bgcolor="#FFFFFF" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><span class="cinza centrado" style="color: #8A867A;display: block;text-align: center">não consegue visualizar correctamente? clique <a href="ficheiro_impressao.pdf" target="_blank" style="color: #8A867A;text-decoration: none">aqui</a> para uma versão de impressão</span></td>
            </tr>
            <tr>
              <td bgcolor="#FFFFFF" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table width="500" border="0" align="center" cellpadding="0" cellspacing="2">
                  <tr>
                    <td width="50%" align="left" valign="top" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table width="100" border="0" cellpadding="0" cellspacing="0" class="agenda">
                        <tr>
                          <th style="font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;background: #8A867A;font-size: 10px;padding: 5px;color: white;text-align: center">Janeiro 2014</th>
                        </tr>
                        <tr>
                          <td style="font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;font-size: 48px;color: #8A867A;line-height: 48px;border: 1px solid #8A867A;padding: 2px;text-align: center">31</td>
                        </tr>
                      </table>
                        <br />
                      Conferência
                      <h2 class="vermelho" style="color: #89181A;font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 20px;font-style: normal;line-height: normal;font-weight: normal;font-variant: normal;padding: 0;margin: 5px 0">Acidente de trabalho - Acidente in Itinere - Descaracterização e Consequências</h2>
                      <h4 style="font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 12px;font-style: normal;line-height: normal;font-weight: bold;font-variant: normal;padding: 0;margin: 4px 0">Orador: Professor Doutor Júlio Gomes, Docente da Faculdade de Direito da Universidade Católica do Porto</h4>
                      <p><span class="vermelho" style="color: #89181A">Horário: </span>18h30m<br />
                      <span class="vermelho" style="color: #89181A">Local: </span> Auditório do ISMAI<br />
                      <span class="vermelho" style="color: #89181A">Organização: </span> Delegação da Maia da Ordem dos <br />
                        Advogados e a Associação Jurídica<br />
                        da Maia<br />
                        <span class="vermelho" style="color: #89181A">Informações </span><br />
                        Delegação da Maia<br />
                        <span class="vermelho" style="color: #89181A">E-mail: </span> maia@del.oa.pt</p></td>
                    <td align="left" valign="top" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table width="100" border="0" cellpadding="0" cellspacing="0" class="agenda">
                        <tr>
                          <th style="font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;background: #8A867A;font-size: 10px;padding: 5px;color: white;text-align: center">Fevereiro 2014</th>
                        </tr>
                        <tr>
                          <td style="font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;font-size: 48px;color: #8A867A;line-height: 48px;border: 1px solid #8A867A;padding: 2px;text-align: center">04</td>
                        </tr>
                      </table>
                        <br />
                      Ciclo de Conferências
                      <h2 class="vermelho" style="color: #89181A;font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 20px;font-style: normal;line-height: normal;font-weight: normal;font-variant: normal;padding: 0;margin: 5px 0">As recentes alterações ao código de trabalho</h2>
                      <h4 style="font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 12px;font-style: normal;line-height: normal;font-weight: bold;font-variant: normal;padding: 0;margin: 4px 0"><strong>A GTI - Gestão, Tecnologia e Inovação S.A vai realizar um Ciclo de Conferên-cias subordinado ao tema "As Recentes Alterações ao Código do Trabalho” onde serão oradoras a Exma. Senhora Dra. Suzana Fernandes da Costa e  a Exma. Senhora Dra. Conceição Soares, Advogadas da SFC Advogados.</strong></h4>
                      <p><span class="vermelho" style="color: #89181A">Programa</span><br />
                        Carlos Vasconcelos<br />
                        Vogal-Secretário do Conselho Distrital</p></td>
                  </tr>
                </table>
                  <p>&nbsp;</p>
                <table border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td colspan="2" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><h2 class="cinza margem-azul" style="color: #8A867A;border-top: 1px solid #A1C1BE;border-bottom: 1px solid #A1C1BE;font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 20px;font-style: normal;line-height: normal;font-weight: normal;font-variant: normal;padding: 0;margin: 5px 0">Divulgação Institucional</h2>
                          <h2 class="vermelho" style="color: #89181A;font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 20px;font-style: normal;line-height: normal;font-weight: normal;font-variant: normal;padding: 0;margin: 5px 0">Coral de S. Ivo - Inscrições abertas</h2>
                        <h4 style="font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 12px;font-style: normal;line-height: normal;font-weight: bold;font-variant: normal;padding: 0;margin: 4px 0">Coro do Conselho Distrital da Ordem dos Advogados do Porto</h4>
                        <br />
                          <span class="vermelho" style="color: #89181A">Ensaios: </span>Quartas-feiras das 21h30h às 23:00h, na Cave das Artes, sita na Praça da R<br />
                        210,4050 Porto<br />
                        <span class="vermelho" style="color: #89181A">Contactos:</span> 917665251 (Dr.ª. Ângela Rodrigues) e 934245497 (Dr. Marcelo Santos)<br />
                        Divulgação Institucional
                        <p>&nbsp;</p></td>
                    </tr>
                </table></td>
            </tr>
            <tr>
              <td bgcolor="#A0C1BD" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table width="600" height="99" border="0" cellpadding="0" cellspacing="0" bgcolor="#A0C1BD" id="Table_01">
                  <tr>
                    <td style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><img src="http://www.oa.pt/Conteudos/Media/file.aspx?ida=132762" width="156" height="99" alt="Footer_01" style="display: block" /></td>
                    <td width="200" height="99" align="left" valign="middle" bgcolor="#A0C1BD" class="branco reduzido" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 9px;color: white;line-height: 14px">Está a receber a nossa publicação porque está ativo na lista de subscritores da Ordem dos Advogados. Para mais informações contacte <a href="mailto:comunicacao@cdp.oa.pt" target="_blank" class="branco" style="color: white;text-decoration: none">comunicacao@cdp.oa.pt</a></td>
                    <td style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><img src="http://www.oa.pt/Conteudos/Media/file.aspx?ida=132763" width="162" height="99" alt="Footer_02" style="display: block" /></td>
                    <td width="82" height="99" align="left" valign="middle" bgcolor="#A0C1BD" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><h3 class="branco" style="color: white;font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 12px;font-style: normal;line-height: normal;font-weight: bold;font-variant: normal;padding: 0;margin: 4px 0;text-transform: uppercase"><a href="https://www.facebook.com/cdporto.oa" target="_blank" class="branco" style="color: white;text-decoration: none">Facebook</a></h3>
                        <h3 class="branco" style="color: white;font-family: Trebuchet, Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;display: block;font-size: 12px;font-style: normal;line-height: normal;font-weight: bold;font-variant: normal;padding: 0;margin: 4px 0;text-transform: uppercase"><a href="http://www.oa.pt/CD/default.aspx?sidc=31690" target="_blank" class="branco" style="color: white;text-decoration: none">Website</a></h3></td>
                  </tr>
              </table></td>
            </tr>
        </table></td>
      </tr>
    </table></td>
    <td width="200" align="center" valign="top" style="font-family: Verdana, Helvetica, Arial, sans-serif;font-size: 11px;color: #585858;line-height: 14px"><table border="0" align="center" cellpadding="0" cellspacing="0" style="border-collapse:collapse">
        <tr>
          <td width="200" height="1600"><img src="http://www.oa.pt/Conteudos/Media/file.aspx?ida=132726" alt="Right" width="200" height="1600" style="display: block" /></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#ffffff"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#ffffff"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#ffffff"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#ffffff"></td>
        </tr>
        <tr>
          <td width="200" height="200" bgcolor="#b7ae9d"></td>
        </tr>
      </table></td>
  </tr>
</table>
</body>
</html>

检查http://jsfiddle.net/uMwHa/以获得正确呈现的视图。

这些列比当前内容高很多，以允许更长的消息（客户实际上要求它），并使用表格单元格来模仿图像下方的颜色模式，以避免由于 Outlook 的 1780 像素分页愚蠢而导致图像被剪切.

问题是：在编辑过程中，一切都完美显示，模板保持原样。发送时，左列的图像保持不变，但标题和右列图像被删除。img 标签只是从电子邮件正文中删除。该表保留其结构和适当的大小（没有取消格式化），但在图像应该存在的单元格中，只有空白区域。

在 Outlook 2007 中，这不会发生，所有转发都没有问题。

做了一系列故障排除步骤，发现如果我在word 2003上编辑html文件并使用office的剪贴板管理器将其复制到outlook，图像也会被删除。在 Outlook 2003 中保存电子邮件（只是简单的保存到文件）也会删除图像。

我在这里真的很茫然，因为一切都应该正常工作......

4

1 回答 1

0

您在代码的开头缺少 DOCTYPE

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

1,800 像素错误：如果您创建长电子邮件，例如大型季度通讯，Outlook 可以在大约 1800 像素时破坏您的电子邮件。还记得我们提到 Outlook 2000、2003、2007 和 2010 使用 Word 呈现吗？在这种情况下，Outlook 将您的电子邮件视为多页文字处理器文档，并添加分页符。惊喜！

也许这可能是你的问题？你有没有试过把它缩短很多只是为了测试？

于 2015-11-05T08:35:33.000 回答