如何在所有电子邮件客户端中隐藏表

时间:2015-07-07 08:16:59

标签: html css email-client email-templates

我用这样的方式写了使用C#代码传递电子邮件html中的div:

  <div style='display:none !important; visibility:hidden; opacity:0;
       color:transparent; height:0; width:0; mso-hide:all; line-height:0px; 
            font-size:0px'>DATA'</div>

2 个答案:

答案 0 :(得分:1)

您无法在Gmail中有效地隐藏元素,但您可以将其归零

诀窍是利用Gmail和其他电子邮件客户端之间的差异。这种差异是因为Gmail不会读取或呈现除内联样式之外的任何样式。 <{1}}标记内写的任何CSS都将被忽略。

仅适用于Gmail的情况,因此我们可以通过将要隐藏的元素的内联样式设置为零值来利用这种差异,并在<style></style>块中为我们设置适当的值该元素使Gmail以外的所有客户端都能正确呈现元素。

<style></style>

以下示例中添加<style> *[class=mobile] { display:none; } @media only screen and (max-width:600px) { *[class=mobile] { display:block !important; width:auto !important; max-height:inherit !important; overflow:visible !important; float:none !important; } *[class="block"] { display:block !important; padding:5px; } } </style> <!--[if !mso]><!--> <table border=0 cellpadding=0 cellspacing=0> <tr> <td class="mobile" style="width:0;max-height:0;overflow: hidden;"> <img src="http://www.placehold.it/150x150" alt="" border=0 width="100%" style="display:block;" /> </td> </tr> </table> <!--<![endif]--> 代码是为了增加对Outlook的支持。

答案 1 :(得分:0)

我认为,你试图隐藏div中的表格。它正在gmail和Outlook客户端中创建问题。

在这种情况下,将表格样式应用于表格也会解决您的问题,如果没有,请分享更多有关问题的信息。

My::Testing::testme()