0

我有一封 HTML 电子邮件,它使用{display:none!important;}创建了一个移动版本,并有一个使用{display:block!important;}显示它的媒体查询。

在 Outlook 中转发时,电子邮件会中断并显示两个图像,在移动图像旁边的右侧留下一个巨大的间隙。

有没有人找到在转发时可以保持外观的编码解决方案?

HTML

    <table width="570" border="0" cellpadding="0" cellspacing="0" align="center" class="deviceWidth">
    <tr>
        <td class="vanish">
            <table width="570" border="0" cellpadding="0" cellspacing="0" align="center" class="deviceWidth">
                <tr>
                    <td>
                        <a href="#" style="color: #999; text-decoration: none;">
                            <img src="Desktop.jpg" width="205" height="171" alt="" class="deviceWidth" style="display: block; background-color: #343434;" border="0"></a></td>
                </tr>
            </table>
        </td>
    </tr>
</table>
<!-- End One Column -->
<!-- Houdini Start -->
<table width="100%" border="0" cellpadding="0" cellspacing="0" align="center" class="deviceWidth">
    <tr>
        <td style="display: none; visibility: none; width: 0px; height: 0px;" class="houdini">
            <a href="#" style="color: #999; text-decoration: none;">
                <img style="display: none; visibility: hidden; width: 0px; height: 0px; border: 0px;" src="Mobile.jpg" alt="" class="houdini" /></a>
        </td>
    </tr>
</table>
<!-- Houdini End -->
4

0 回答 0