这是我的html模板代码,在Outlook Web中可以正常工作,但在Outlook Client中完全不可用。
<table cellpadding="0" cellspacing="0" class="es-content" align="center" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;">
<tr style="border-collapse:collapse;">
<td align="center" style="padding:0;Margin:0;">
<table bgcolor="#ffffff" class="es-content-body" align="center" cellpadding="0" cellspacing="0" width="600" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:#FFFFFF;">
<tr style="border-collapse:collapse;">
<td align="left" style="padding:0;Margin:0;padding-top:20px;padding-left:45px;padding-right:70px;">
<table cellpadding="0" cellspacing="0" width="100%" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
<tr style="border-collapse:collapse;">
<td width="560" align="center" valign="top" style="padding:0;Margin:0;">
<table style="font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
color: #32618b;">
<tr style="height:25px">
<td style="
background: #9bb0e8;
width: 18.1%;
color: white;
font-size: 12px;
font-weight: 600;
border-left: 2px solid #6f93f3;
border-right: 2px solid #6f93f3;
border-top: 2px solid #6f93f3;
border-bottom: 2px solid #6f93f3;
text-align: center;
vertical-align: middle;
" rowspan="2">Instructor-led<br>Training
</td>
<td style="text-align:left; border-right: 1px solid #0303ab; font-size:12px; font-weight: 600; background:#acbdeb;font-style:italic;border-top:2px solid #6f93f3;border-right:2px solid #6f93f3; padding-left: 6px;">Instructor-led</td>
<td style="text-align:right; background:#acbdeb; padding-right:6px;border-right:2px solid #6f93f3;border-top:2px solid #6f93f3">
<span style="font-size:11; font-weight: 600"></span>
<span style="font-size:10px;">(the avg. per person learning hours is)</span>
</td>
</tr>
<tr style="height:25px">
<td style="text-align:left; font-size:12px; border-right: 1px solid #0303ab; font-weight: 600;font-style:italic;border-right:2px solid #6f93f3; padding-left: 6px;">Online</td>
<td style="text-align:right; padding-right:6px;border-right:2px solid #6f93f3">
<span style="font-size:11; font-weight: 600"></span>
<span style="font-size:10px;">(the avg. per person learning hours is)</span></td>
</tr>
<tr style="height:25px">
<td style="
background: #9bb0e8;
width: 18%;
color: white;
font-size: 12px;
font-weight: 600;
border-left: 2px solid #6f93f3;
border-right: 2px solid #6f93f3;
border-bottom: 2px solid #6f93f3;
text-align: center;
vertical-align: middle;
" rowspan="2">Online<br>Training </td>
<td style="text-align:left; font-size:12px; border-right: 2px solid #6f93f3; border-top:2px solid #6f93f3; font-weight: 600;background:#acbdeb;font-style:italic;padding-left: 6px;">Instructor-led</td>
<td style="text-align:right; font-size:10px;background:#acbdeb;padding-right:6px; border-top:2px solid #6f93f3;border-right:2px solid #6f93f3">(Excel file attached)</td>
</tr>
<tr style="height:25px">
<td style="text-align:left;padding-left: 6px; font-size:12px; font-weight: 600; border-bottom:2px solid #6f93f3;font-style:italic;border-right:2px solid #6f93f3">Online</td>
<td style="text-align:right; font-size:10px;padding-right:6px;border-right:2px solid #6f93f3;border-bottom:2px solid #6f93f3">(Excel file attached)</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- upskilling programs 5 rows -->
<table style="font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
color: #32618b;">
<tr style="height:25px; ">
<td style="background: #9bb0e8;
width: 18%;
color: white;
font-size: 13px;
border-left: 2px solid #6f93f3;
border-right: 2px solid #6f93f3;
text-align: center;
vertical-align: middle;
border-bottom: 2px solid #6f93f3;
font-weight: 600;" rowspan='5' ;>Upskilling
<br>Programs </td>
<td style="text-align:left; font-size:12px; font-weight: 600;background:#acbdeb; width:43%; border-right: 2px solid #6f93f3; font-style:italic;padding-left: 6px;">Program</td>
<td style="text-align:left; font-size:12px; font-weight: 600;background:#acbdeb;padding-left: 6px; border-right: 2px solid #6f93f3; width:40%; font-style:italic; ">Completion Status
</td>
</tr>
<tr style="height:25px">
<td style="text-align:left;padding-left: 6px; font-size:11px;padding-left: 3px; padding-right: 2px; border-right:2px solid #6f93f3;"></td>
<td style="text-align:left; font-size:11px;padding-left: 6px;border-right: 2px solid #6f93f3;"></td>
</tr>
<tr style="height:25px; background:#acbdeb;">
<td style="text-align:left; font-size:11px;padding-left: 3px;padding-left: 6px; padding-right: 2px;border-right: 2px solid #6f93f3;"></td>
<td style="text-align:left; font-size:11px; border-right: 2px solid #6f93f3;padding-left: 6px;"></td>
</tr>
<tr style="height:25px">
<td style="text-align:left; font-size:11px;padding-left: 3px; padding-right: 2px;border-right: 2px solid #6f93f3;padding-left: 6px;"></td>
<td style="text-align:left; font-size:11px; border-right: 2px solid #6f93f3;padding-left: 6px;"></td>
</tr>
<tr style="height:25px; background:#acbdeb;">
<td style="text-align:left; font-size:11px;padding-left: 3px; padding-right: 2px;border-right: 2px solid #6f93f3;padding-left: 6px;
border-bottom: 2px solid #6F93F3;"></td>
<td style="text-align:left; font-size:11px;border-right: 2px solid #6f93f3; padding-left: 6px;
border-bottom: 2px solid #6F93F3; ; border-bottom-color: #6F93F3;"></td>
</tr>
</table>
<!-- Certifications done 4 rows -->
<table style="font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
color: #32618b;">
<tr style="height:25px">
<td style="
background: #9bb0e8;
width: 18%;
color: white;
font-size: 12px;
font-weight: 600;
border-left: 2px solid #6f93f3;
border-right: 2px solid #6f93f3;
border-bottom-width: 2px;
border-bottom-color: #6F93F3;
border-bottom: 2px solid #6f93f3;
text-align: center;
vertical-align: middle;
" rowspan="4">Certifications
<br>Done</td>
<td style="text-align:left;padding-left: 6px; font-size:11px; width:81%; border-style: none solid none none;
border-right-width: 1.5pt;border-right-color: #6F93F3;"></td>
</tr>
<tr style="height:25px; background:#acbdeb;">
<td style="text-align:left; font-size:11px;padding-left: 6px;border-style: none solid none none;border-right-width: 1.5pt;
border-right-color: #6F93F3;"></td>
</tr>
<tr style="height:25px;">
<td style="text-align:left; font-size:11px;padding-left: 6px; border-style: none solid none none;
border-right-width: 1.5pt; border-right-color: #6F93F3;"></td>
</tr>
<tr style="height:25px; background:#acbdeb;">
<td style="text-align:left; font-size:11px;padding-left: 6px;border-style: none solid none none;
border-right-width: 1.5pt;
border-right-color: #6F93F3;
border-bottom: 2px solid #6f93f3;
"></td>
</tr>
</table>
<!-- Enrolled but not attended -->
<table style="font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
color: #32618b;">
<tr style="height:25px">
<td style="
background: #9bb0e8;
width: 18%;
color: white;
font-size: 12px;
font-weight: 600;
border-left: 2px solid #6f93f3;
border-right: 2px solid #6f93f3;
border-bottom: 2px solid #6f93f3;
text-align: center;
vertical-align: middle;" rowspan="4">Enrolled
<br>But Not
<br>Attended</td>
<td style="text-align:left; font-size:11px;width:81%;border-right: 2px solid #6f93f3;padding-left: 6px;"></td>
</tr>
<tr style="height:25px; background:#acbdeb;">
<td style="text-align:left; font-size:11px;padding-left: 6px; border-style: none solid none none;
border-right-width: 1.5pt; border-right-color: #6F93F3;"> </td>
</tr>
<tr style="height:25px">
<td style="text-align:left; font-size:11px;padding-left: 6px;border-style: none solid none none;
border-right-width: 1.5pt; border-right-color: #6F93F3;"></td>
</tr>
<tr style="height:25px; background:#acbdeb;border-bottom: 2px solid #6f93f3;">
<td style="text-align:left; font-size:11px;padding-left: 6px;border-style: none solid none none;
border-right-width: 1.5pt; border-right-color: #6F93F3;"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
此表在表中变形,实际上Outlook客户端软件中没有右端td边框,我正在使用Windows 10,Outlook 2016,使用UiPath对其进行测试。我使用了putsmail.com,但效果很好
请帮助专家。
答案 0 :(得分:1)
Desktop Outlook 2007、2010、2013、2016和2019使用Word的HTML呈现代码,而在Web上由用户的浏览器就地呈现。
Outlook 97-2003使用mshtml.dll
(又名Trident,Internet Explorer的引擎)来呈现HTML电子邮件。由于Outlook使用Word编写HTML电子邮件,但使用Internet Explorer查看它们,因此这使Outlook用户的电子邮件外观不一致-微软的决定是使用Word进行撰写和查看-我认为这是阻止HTML的巨大错误电子邮件已经发展了数十年,并一直受到阻碍,因为它现在是最低的公分母(这是因为Word对HTML和CSS功能的支持几乎超出了Internet Explorer 5.x所支持的范围,因此请不要使用Flexbox和CSS Grids之类的东西)。