首页 > 解决方案 > 响应式电子邮件 - 在 gmail 应用程序 (iOs) 中隐藏图像

问题描述

使用 Gmail 移动应用程序时是否可以隐藏图像?我在 iOS 上使用我的移动应用程序并尝试了 2 个小时,但一点运气都没有。

<style type="text/css">

     
@media only screen and (max-width:600px) {
            
    table.hide { display: none !important }
          
        
}

</style>

<table class="hide" align="right" width="324" border="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <td align="left" style="padding: 40px 40px 0px 110px;"><img src="#" width="172" height="42" border="0" alt="Release"></td>
    </tr>
  </tbody>
</table>    

标签: htmlcssemailresponsive-designhtml-email

解决方案


您的代码对我有用,除了有不同的 Gmail 版本,而且 Gmail IMAP/POP 是一种根本不支持类/嵌入式 CSS(它已完全删除)。Android 原生电子邮件也是如此。

也许正如@HTeuMeuLeu 所指出的,需要正常的结构。

这是我使用的:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <title></title>
  <style type="text/css">
    @media only screen and (max-width:600px) {  
      table.hide { display: none !important }
    }
  </style>
  </head>
<body>
<table class="hide" align="right" width="324" border="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <td align="left" style="padding: 0;"><img src="https://via.placeholder.com/172x42" width="172" height="42" border="0" alt="Release"></td>
    </tr>
      <tr>
      <td align="left" style="padding: 0;">This is a test</td>
    </tr>
  </tbody>
</table>    
</body>
</html>

推荐阅读