Html Outlook断开响应模板
我已经建立了一个移动响应电子邮件，但在Outlook和Hotmail上，它最终进入了移动形式，而不是桌面形式。因此，图像不是放在文本的右边，而是放在文本的下面 我不知道如何纠正这一点，任何建议都将不胜感激 CSSHtml Outlook断开响应模板,html,css,outlook,Html,Css,Outlook,我已经建立了一个移动响应电子邮件，但在Outlook和Hotmail上，它最终进入了移动形式，而不是桌面形式。因此，图像不是放在文本的右边，而是放在文本的下面 我不知道如何纠正这一点，任何建议都将不胜感激 CSS /*特定于客户端的样式*/ 正文，表格，td，a{-webkit文本大小调整：100%；-ms文本大小调整：100%；} 表，td{mso表lspace:0pt；mso表rspace:0pt；} img{-ms插值模式：双三次；} /*重置样式*/ img{边框：0；高度：自动；线条
/*特定于客户端的样式*/
正文，表格，td，a{-webkit文本大小调整：100%；-ms文本大小调整：100%；}
表，td{mso表lspace:0pt；mso表rspace:0pt；}
img{-ms插值模式：双三次；}
/*重置样式*/
img{边框：0；高度：自动；线条高度：100%；轮廓：无；文本装饰：无；}
表{边框折叠：折叠！重要；}
正文{高度：100%！重要；边距：0！重要；填充：0！重要；宽度：100%！重要；}
/*iOS蓝色链接*/
a[x-apple-data-Detector]{
颜色：继承！重要；
文字装饰：无！重要；
字体大小：继承！重要；
字体家族：继承！重要；
字体大小：继承！重要；
行高：继承！重要；
}
/*移动风格*/
@媒体屏幕和屏幕（最大宽度：600px）{
.img最大值{
宽度：100%！重要；
最大宽度：100%！重要；
高度：自动！重要；
}
.img浮球{
显示：块；
浮动：无；
保证金：0自动20px！重要；
}
.最大宽度{
最大宽度：100%！重要；
}
.移动包装{
宽度：85%！重要；
最大宽度：85%！重要；
}
.移动垫{
左侧填充：5%！重要；
右边填充：5%！重要；
}
/*使用这些类隐藏移动设备上的内容*/
.移动隐藏{
显示：无！重要；
}
.移动手机隐藏{
宽度：0；
}
}
@媒体屏幕和屏幕（最小宽度：600px）{
/*使用这些类隐藏移动设备上的内容*/
.流动展览{
显示：无！重要；
}
}
/*安卓中心补丁*/
div[style*=“边距：16px 0；”]{边距：0！重要；}
亲爱的~FORENAME~，
每期的House Beauting都包含最新潮流和时尚灵感，为您的家和花园提供实用建议。
为了庆祝银行假日，我们为您提供了一个仅需英镑就可以试销六期的机会；6每个月你都会受到读者之家、漂亮的购物和简单的改造想法的启发。
<style type="text/css">
/* CLIENT-SPECIFIC STYLES */
body, table, td, a { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
img { -ms-interpolation-mode: bicubic; }
/* RESET STYLES */
img { border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; }
table { border-collapse: collapse !important; }
body { height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important; }
/* iOS BLUE LINKS */
a[x-apple-data-detectors] {
color: inherit !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
/* MOBILE STYLES */
@media screen and (max-width: 600px) {
.img-max {
width: 100% !important;
max-width: 100% !important;
height: auto !important;
}
.img-float {
display:block;
float:none;
margin:0 auto 20px !important;
}
.max-width {
max-width: 100% !important;
}
.mobile-wrapper {
width: 85% !important;
max-width: 85% !important;
}
.mobile-padding {
padding-left: 5% !important;
padding-right: 5% !important;
}
/* USE THESE CLASSES TO HIDE CONTENT ON MOBILE */
.mobile-hide {
display: none !important;
}
.mobile-cell-hide {
width: 0;
}
}
@media screen and (min-width: 600px) {
/* USE THESE CLASSES TO HIDE CONTENT ON MOBILE */
.mobile-show {
display: none !important;
}
}
/* ANDROID CENTER FIX */
div[style*="margin: 16px 0;"] { margin: 0 !important; }
</style>
<!--RIGHT ALIGNED IMAGE ARTICLE MODULE--->
<tbody>
<tr>
<td bgcolor="#ffffff" align="center" style="padding: 20px 15px 0 15px;" class="section-padding"><!--[if (gte mso 9)|(IE)]>
<table align="center" border="0" cellspacing="0" cellpadding="0" width="550">
<tr>
<td align="center" valign="top" width="550">
<![endif]-->
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 550px;" class="responsive-table">
<tbody>
<tr>
<td>
<table align="center" border="0" cellpadding="0" cellspacing="0" style="max-width:550px;" width="100%">
<tbody>
<tr>
<td><!-- ARTICLE COPY -->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td align="left" style="padding: 0 0 0 0; font-size: 18px; line-height: 20px; font-family: Helvetica, Arial, sans-serif, serif; color: #000000; vertical-align:top" class="padding">
<div style="vertical-align: top">
<!--[if mso]>
<table border="0" cellpadding="0" cellspacing="0" width="160" align="right" style="width:160px;"><tr><td style="padding:0 0 20px 20px;">
<![endif]--><a href="~PROBE(204)~"><img alt="insert alt text here" class="img-max img-float" align="right" style="display: block; font-family: sans-serif; font-size: 16px; color: #999999; vertical-align: top; Margin:0 0 10px 10px;" width="250px" src="http://hearst.emsecure.net/images/HouseBeautiful/spread1.jpg" /></a> <!--[if mso]>
</td></tr></table>
<![endif]-->
</div>
Dear ~FORENAME~,<br />
<br />
Every issue of <i>House Beautiful</i> is packed with the latest trends and stylish inspiration, featuring practical advice for your home and garden.<br />
<br />
To celebrate the bank holiday, we're offering you the chance to try six issues for <b>JUST £6</b> and every month you'll be inspired by reader homes, beautiful buys and easy makeover ideas.<br />
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="center"></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]--></td>
</tr>
<!--END OF RIGHT ALIGNED IMAGE ARTICLE MODULE--->