html - 显示/隐藏转发的 html 电子邮件的图像

Question

我试图在转发时在 html 电子邮件上显示/隐藏图像(一个用于桌面，一个用于移动)。我使用的方法适用于大多数电子邮件客户端(Lotus 除外)，但是，如果电子邮件被转发，两个图像都会显示。我知道最简单的解决方案是只使用一个图像，但如果有一个解决方案可以在转发时使用显示/隐藏，我想知道。 HTML:

 <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
            <td style="display:block; outline:none; text-decoration:none; -ms- 
             interpolation-mode: bicubic;" class="hide">
              <a href="ops_link"> 
               <img border="0" width="100%" src="ops_desktop_pic" alt="#" 
               class="hide" > 
             </a>
            </td>
            <td style="display:none; font-size:0; line-height:0; mso-hide: 
            all;max-height: 0; max-width: 0; width:0; -ms-interpolation-mode: 
            bicubic;" class="show">
             <a href="ops_link">
              <img border="0" width="100%" height="357"  src="ops_mobile_pic" 
              alt="#" class="show">
             </a>
            </td>
           </tr>
    </table>

和CSS:

    @media (max-width: 650px){
     .hide {
    display:none!important;
    width:0px!important;
    height: 0px!important;
    overflow:hidden!important;
    line-height: 0px!important;
    font-size:0px!important;
}
    .show {
    display:block!important;
    max-height: none !important;
    max-width:100% !important;
    line-height: 1.5 !important;
    width:100%!important;
    height:auto!important;
    font-size: 100%;
    mso-hide: none;
}
}

Answer 1

不，据我所知，无法解释 a) 转发的电子邮件或 b) 某些版本的 OWA。此代码对原始消息非常有效，但您会遇到这些问题。