Css 在outlook上隐藏移动表

我制作了一份时事通讯，但我在手机上的桌子有问题

我有一张这样的移动桌子：

</table class="mobile_table" width="1" height="1">
    <tr>
        <td>
           <img src="mysource/test.jpg">
        </td>
    </tr>
    <tr>
        <td align="center">
           <img src="mysource/test2.jpg">
        </td>
    </tr>
</table>

<style>
  .mobile_table{
        display: none;
        font-size: 0px;
        max-height: 0px;
        line-height: 0px;
        mso-hide: all;
        width: 0px;
        overflow: hidden;
    }
</style>

.移动式桌{
显示：无；
字体大小：0px；
最大高度：0px；
线高：0px；
mso隐藏：全部；
宽度：0px；
溢出：隐藏；
}

我尝试在桌面版上隐藏我的表，它在web版上工作，但在outlook上该表不隐藏

---

你能在这个问题上帮助我吗？

一个方便的书签工具是Campaign Monitor，它显示Outlook的某些版本不支持CSS

display

属性

这一点可以通过以下陈述得到支持：

下面列出了级联样式表规范级别1支持但Word 2007不支持的所有顶级级联样式表属性。请注意，Word 2007将不支持的级联样式表属性视为未知属性

• 背景附件
• 背景图像
• 背景位置
• 背景重复
• 清楚的
• 显示
• 浮动
• 列表样式图像
• 列表样式位置
• 文本转换
• 字距

---

同样，那些版本的Outlook也不支持通常用于隐藏元素的其他“技巧”，例如更改元素的可见性和/或将其维度设置为0并隐藏其溢出。

一个方便的书签工具是Campaign Monitor，这表明Outlook的某些版本不支持CSS

display

属性

这一点可以通过以下陈述得到支持：

下面列出了级联样式表规范级别1支持但Word 2007不支持的所有顶级级联样式表属性。请注意，Word 2007将不支持的级联样式表属性视为未知属性

• 背景附件
• 背景图像
• 背景位置
• 背景重复
• 清楚的
• 显示
• 浮动
• 列表样式图像
• 列表样式位置
• 文本转换
• 字距

---

类似地，您通常用于隐藏元素的其他“技巧”，例如更改其可见性和/或将其维度设置为0并隐藏其溢出，这些版本的Outlook也不支持这些技巧。

我发现的解决方法之一是使用一些电子邮件客户端目标。将下面的代码包装在仅响应的元素周围，它应该隐藏在Outlook中：）它基本上是一个if语句，表示“如果不是MS Outlook，请执行此操作”

---

你只需要确保你的代码在mso标签中有或没有代码时都是有效的。

我发现的一个解决方法是使用一些电子邮件客户端定位。将下面的代码包装在仅响应的元素周围，它应该隐藏在Outlook中：）它基本上是一个if语句，表示“如果不是MS Outlook，请执行此操作”

---

您只需确保您的代码在mso标记中的代码有效，而在mso标记中的代码无效。

无重复的可能重复，问题出在总布局的表号上……您是否尝试将样式插入内联？如果是，请更新问题。您在哪个版本的Outlook中测试此问题？可能重复无重复，问题在总平面图上的表上无…您是否尝试内联插入样式？如果是的话，请更新问题。你在用什么版本的Outlook测试这个问题？很好，你知道是否存在gmail的条件吗？很好，你知道是否存在gmail的条件吗？

<!--[if !mso]><!---->
    <tr>
    <td class="show_only_mobile" style="width:0; max-height: 0; height:0; overflow:hidden; display:none;">
    <table width="100%" cellpadding="0" cellspacing="0" border="0" class="show_only_mobile">
        <tr>
            <td>
               <img src="mysource/test.jpg">
            </td>
        </tr>
        <tr>
            <td align="center">
               <img src="mysource/test2.jpg">
            </td>
        </tr>
    </table>
    </td>
    </tr>
<!--<![endif]-->

.show_only_mobile {
    display : block !important;
    width : auto !important;
    max-height: inherit !important;
    overflow : visible !important;
    line-height: normal !important;
}