Windows Outlook 365 中的表格电子邮件问题答案

【问题标题】：Table Email Issues in Windows Outlook 365Windows Outlook 365 中的表格电子邮件问题
【发布时间】：2015-03-02 19:50:58
【问题描述】：

为了提前回答问题，客户要求我们以这种方式创建它。我们已经解释了它在不同的电子邮件客户端上看起来是多么的低效和草率，但他们不在乎。古老、久经考验和真实是他们的座右铭。

现在...我们似乎对他们的电子邮件新闻有疑问。时事通讯的底部正在中断。此问题仅在 Windows Outlook 客户端上显示。没有别的。我们在代码中找不到错误...所以我们决定求助于 StackOverflow 寻求可能的解决方案。

<html>
<head>
<title>Want to grab their attention?</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="600" height="1100" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td style="line-height:106px;" colspan="3">
            <img style="display:block;" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_01.jpg" width="600" height="106" alt=""></td>
    </tr>
    <tr>
        <td style="line-height:362px;" colspan="3">
            <a href="http://www.thehenryford.org/privateevents/venues2.aspx">
                <img style="display:block;" src="https://s3.amazonaws.com/thehenryford/eblast_36828/Grab-Their-Attention.jpg" width="600" height="362" border="0" alt="Grab Their Attention"></a></td>
    </tr>
    <tr>
        <td style="line-height:25px;" colspan="3">
            <img style="display:block;" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_03.jpg" width="600" height="25" alt=""></td>
    </tr>
    <tr>
        <td style="line-height:607px;" rowspan="2">
            <img style="display:block;" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_04.jpg" width="39" height="607" alt=""></td>
        <td style="line-height:39px;">
            <a href="http://www.thehenryford.org/plan/">
                <img style="display:block;" src="https://s3.amazonaws.com/thehenryford/eblast_36828/Get-Started.jpg" width="125" height="39" border="0" alt="Get started"></a></td>
        <td style="line-height:607px;" rowspan="2">
            <img style="display:block;" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_06.jpg" width="436" height="607" alt=""></td>
    </tr>
    <tr>
        <td style="line-height:586px;">
            <img style="display:block;" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_07.jpg" width="125" height="568" alt=""></td>
    </tr>
</table>
</body>
</html>

【问题讨论】：

标签： html outlook html-email newsletter

【解决方案1】：

我能够在bottom and fix 中复制中断。
1 - 避免像瘟疫一样的行跨度
2 - 行高无用

代码如下：

<html>
<head>
    <title>Want to grab their attention?</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <table border="0" cellpadding="0" cellspacing="0" width="600">
        <tr>
            <td colspan="3" style="line-height:106px;"><img alt="" height="106" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_01.jpg" style="display:block;" width="600"></td>
        </tr>
        <tr>
            <td colspan="3" style="line-height:362px;">
                <a href="http://www.thehenryford.org/privateevents/venues2.aspx"><img alt="Grab Their Attention" border="0" height="362" src="https://s3.amazonaws.com/thehenryford/eblast_36828/Grab-Their-Attention.jpg" style="display:block;" width="600"></a>
            </td>
        </tr>
        <tr>
            <td colspan="3" style="line-height:25px;"><img alt="" height="25" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_03.jpg" style="display:block;" width="600"></td>
        </tr>
        <tr>
            <td style="line-height:607px;"><img alt="" height="607" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_04.jpg" style="display:block;" width="39"></td>
        </td>
        <td align="left" valign="top">
            <table cellpadding="0" cellspacing="0" border="0" width="100%">
                <tr>
                    <td align="left" valign="top">
                        <a href="http://www.thehenryford.org/plan/"><img alt="Get started" border="0" height="39" src="https://s3.amazonaws.com/thehenryford/eblast_36828/Get-Started.jpg" style="display:block;" width="125"></a>
                    </td>
                </tr>
                <tr>
                    <td><img alt="" height="568" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_07.jpg" style="display:block;" width="125"></td>
                </tr>
            </table>
        </td>
        <td style="line-height:607px;"><img alt="" height="607" src="https://s3.amazonaws.com/thehenryford/eblast_36828/MKTG_5245_MI_meeting_and_events_06.jpg" style="display:block;" width="436"></td>
    </tr>
</table>
</body>
</html>

【讨论】：