Html 在IE上的Microsoft Outlook中以不同方式呈现表间距_Html_Internet Explorer_Email_Outlook

Html 在IE上的Microsoft Outlook中以不同方式呈现表间距

html internet-explorer email outlook

Html 在IE上的Microsoft Outlook中以不同方式呈现表间距,html,internet-explorer,email,outlook,Html,Internet Explorer,Email,Outlook,我目前正在尝试使用HTML电子邮件的图像和表格创建一个圆角框。除了IE上的MicrosoftOutlook（测试8和9），它在所有客户端和浏览器中都非常出色。以下是代码片段： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/

我目前正在尝试使用HTML电子邮件的图像和表格创建一个圆角框。除了IE上的MicrosoftOutlook（测试8和9），它在所有客户端和浏览器中都非常出色。以下是代码片段：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=4" />
<title></title>
</head>
<body style="margin:0px; padding:0px;">
<style type="text/css">
.ReadMsgBody {width: 100%;}
.ExternalClass {width: 100%;}
</style>

<table width="174" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td width="174" align="left" valign="top" style="line-height:0px;">
        <img src="lmir_tmpl_box_top.png" width="174" height="13" align="left" border="0" style="display:block;" alt="" />
        </td>
    </tr>
    <tr>
        <td width="174" align="left" valign="top">

            <table width="174" border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <td width="8" height="100%" align="left" valign="top" bgcolor="#dcddde"></td>
                    <td width="158" align="left" valign="top" bgcolor="#dcddde">

                        <table width="158" border="0" cellspacing="0" cellpadding="0">
                            <tr>
                                <td width="158" align="left" valign="top" style="line-height:15px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#414042; font-size:11px; font-weight:bold;">
        Now you can access on your mobile device!
                                </td>
                            </tr>
                            <tr>
                                <td width="158" height="8" align="left" valign="top"></td>
                            </tr>
                            <tr>
                                <td width="158" height="1" align="left" valign="top" bgcolor="#CCCCCC"></td>
                            </tr>
                            <tr>
                                <td width="158" height="8" align="left" valign="top"></td>
                            </tr>
                            <tr>
                                <td width="158" align="left" valign="top" style="line-height:15px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#414042; font-size:11px; font-weight:bold;">
                                <img src="arrow.png" width="10" height="12" align="left" alt="" border="0" style="display:block;" alt="" />
                                &nbsp;&nbsp;Visit <a href="#" style="color:#00aef0;" target="_blank"><span>Link</span></a>
                                </td>
                            </tr>
                        </table>

                    </td>
                    <td width="8" height="100%" align="left" valign="top" bgcolor="#dcddde"></td>
                </tr>
            </table>

        </td>
    </tr>
    <tr>
        <td width="174" align="left" valign="top" style="line-height:0px;">
        <img src="lmir_tmpl_box_bot.png" width="174" height="13" align="left" border="0" style="display:block;" alt="" />
        </td>
    </tr>
</table>

</body>
</html>


.ReadMsgBody{宽度：100%；}
.ExternalClass{宽度：100%；}
现在您可以在移动设备上访问！
参观

以下是Outlook中长方体的屏幕截图：

有人知道为什么中间一排会被推到左边吗？谢谢，如果您有任何问题或意见，请告诉我。

我已经解决了。显然，我不得不从弯曲的角落顶部和底部图像中删除align=“left”。谢谢。

打开所有桌子的边框。你可以分辨出哪个细胞行为不正常。