0
我正在做一個響應式電子郵件,如果電子郵件正在手機上查看,我可以移動圖像。除Outlook中外,其他任何內容都很棒。它在兩個地方展示它。我讀過outlook不能識別「display:none」代碼。還有什麼可以做的嗎?Outlook中的電子郵件中的雙圖像
這是我的代碼看起來像和它的工作的一切,但前景。
媒體查詢代碼
@media only screen and (max-device-width: 479px) {
#mobile {display:block}
#desktop {display:none;mso-hide: all;}
}
@media only screen and (min-device-width: 480px) {
#mobile {display:none;mso-hide: all;}
#desktop {display:block}
}
}
這裏是我使用的HTML。
<table id="mobile" align="right" width="35%" cellpadding="0" cellspacing="0" border="0" class="deviceWidth">
<tr>
<td valign="top" align="right" class="hisrc">
<p style="mso-table-lspace:0;mso-table-rspace:0; margin:0; font-family:Helvetica, sans-serif; font-size:11px; color:323338; text-align:left; line-height:15px;">
<img src="vna-logo.png" alt="" border="0" style="padding-bottom:18px;border-radius: 4px; width: 220px;" class="deviceWidth" />
</td>
</tr>
</table>
<table id="desktop" align="right" width="35%" cellpadding="0" cellspacing="0" border="0" class="deviceWidth">
<tr>
<td valign="top" align="right" class="hisrc">
<p style="mso-table-lspace:0;mso-table-rspace:0; margin:0; font-family:Helvetica, sans-serif; font-size:11px; color:323338; text-align:left; line-height:15px;">
<img src="vna-logo-2.png" alt="" border="0" style="padding-bottom:18px;border-radius: 4px; width: 220px;" class="deviceWidth" />
</td>
</tr>
</table>