我正在尝试在所有电子邮件客户端中正确显示电子邮件广告系列。我已经尝试了很多修复和方法来让我的电子邮件显示写入。我让它在大多数电子邮件客户端上工作得相当好，我已经在电子邮件上测试了它的酸和运动监视器，但是他们没有告诉我们我的代码有什么问题他们只是给我看了一张图片并不是很有帮助。
我认为其中一个主要问题是Outlook 2007中的电子邮件扩展到全宽，因为某些原因我不能使用Max-Width属性，所以我需要一些帮助。
我想知道是否有人可以提供帮助，并在我的代码中看到明显错误并且需要修复的任何内容。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Go City - Email</title>
<style type="text/css">
.ReadMsgBody {width: 100%;}
.ExternalClass {width: 100%;}
table {border-collapse: collapse;}
a:hover {text-decoration: none !important;}
a {color: #fff !important;text-decoration: none !important;}
p {font-size: 14px;line-height: 24px;font-family: arial, 'veranda', san-serif !important;color: #333333 !important;margin: 0px;}
span.yshortcuts {color: #000;background-color: none;border: none;}
span.yshortcuts:hover, span.yshortcuts:active, span.yshortcuts:focus {color: #000;background-color: none;border: none;}
img {border: none !important;display:block;}
.book {background: white;}
.body {max-width: 300px;}
</style>
</head>
<body marginheight="0" topmargin="0" marginwidth="0" style="background-repeat:no-repeat;position:static;height:100%;width:100%;background-image:url('background-new.jpg');background-color:#000000;margin-top:0px;max-width: 630px !important;margin: auto;" bgcolor="#000000" leftmargin="0">
<!-- Outlook Bacground Image -->
<div style="background-color:#000000; max-width:630px !important;">
<!--[if gte mso 9]>
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
<v:fill type="tile" src="url('background-new.jpg')" color="#000000"/>
</v:background>
<![endif]-->
<table height="100%" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td valign="top" align="left" background="#fff"><!-- Outlook Bacground Image End -->
<!--100% body table-->
<table cellspacing="0" align="center" border="0" cellpadding="15" width="600" bgcolor="#000000" style="margin:auto;" >
<tr>
<td align="center"><!--top links-->
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-bottom:20px;">
<tr height="100">
<td valign="middle" align="left" width="40%"><a href="https://gocityhotels.com/" style="text-decoration:none !important;color:#fff !important;" ><img src="go-city-hotels-logo.jpg" style="display:block;" vspace="0" hspace="0" alt="Go City Hotels Logo" /></a></td>
<td valign="middle" align="right" width="60%" style="text-align:center;"><p style="margin:0px;color:#ffffff !important;font-family:arial, 'veranda', san-serif;line-height:24px;font-size:14px;" >
For Better Viewing Results <webversion style="text-decoration:none;color:#10aeea !important;">Please View Online</webversion><br />
<forwardtoafriend style="text-decoration:none;color:#ffffff;" href="#">Forward</forwardtoafriend>
|
<unsubscribe style="text-decoration:none;color:#ffffff;" href="#">Unsubscribe</unsubscribe>
</p></td>
</tr>
</table>
<!--email container-->
<table bgcolor="#000000" cellspacing="0" border="0" align="center" cellpadding="30" width="600">
<tr>
<td style="padding:0px;"><!--email content-->
<table cellspacing="0" border="0" id="email-content" cellpadding="0" width="100%">
<tr>
<td><repeater>
<!--section 1-->
<layout label="Full Width Image">
<table cellspacing="0" border="0" cellpadding="0" width="100%">
<tr>
<td valign="top" align="center"><img editable src="" style="margin-top:10px !important;margin-bottom:10px !important;" vspace="0" hspace="0" alt="Image 3" width="100%" label="Full Width Image" /></td>
</tr>
</table>
</layout>
<!--/section 1-->
<!--section 2-->
<layout label="Colour Title">
<table cellspacing="0" border="0" cellpadding="0" width="100%">
<tr>
<td valign="top" align="center"><h1 style="font-weight:bold;mso-line-height-rule:exactly;line-height:40px;margin-bottom:10px;margin-top:0px;font-family:arial, 'veranda', san-serif;color:#ffffff;font-size:25px;background-color:#10aeea;">
<singleline label="Title">Lorem ipsum</singleline>
</h1></td>
</tr>
</table>
</layout>
<!--/section 2--><!--section 3-->
<layout label="Body Text">
<table cellspacing="0" border="0" cellpadding="0" width="100%">
<tr>
<td valign="top" align="center"><p style="margin:0px;color:#ffffff !important;font-family:arial, 'veranda', san-serif !important;mso-line-height-rule:exactly;line-height:22px;font-size:16px;" >
<multiline label="Main Body Text">Consectetur adipiscing elit. a ipsum a risus volutpat placerat in nec mauris. Fusce sit amet enim erat, in sagittis arcu. semper id tempor et, varius pulvinar tellus. Maurtis commodo urna at dui bibendum quis euismod velit egestas. Vestibulum ante ipsum primis in faucibus orci luctus et.</multiline>
</p></td>
</tr>
</table>
</layout>
<!--/section 3-->
<!--section 2--><layout label="3 Hotel Booking">
<table cellspacing="0" border="0" cellpadding="0" width="100%">
<tr>
<td>
<table cellspacing="0" border="0" cellpadding="8" width="100%" style="margin-top: 10px;">
<tr>
<td bgcolor="#ffffff" valign="top" style="border-radius: 5px;width: 30%;max-width: 30%;"><p style="margin:0px;font-size:14px;text-align:center;" ><img editable src="" style="margin-top:10px !important;margin-bottom:10px !important;" vspace="0" hspace="0" alt="Image 3" width="100%" label="Image Left" /></p>
<p style="color:#333333 !important; font-family:arial, 'veranda', san-serif; text-align:left;" >
<multiline style="color:#333333 !important;" label="Main Body Text">Consectetur adipiscing elit. Phasellus a ipsum a risus volutpat placerat in nec mauris. Fusce sit</multiline></p>
<p style="margin:0px;line-height:24px;font-size:14px;font-family:arial, 'veranda', san-serif;margin-top:20px;padding:5px;text-align:center;border-radius:5px;border:1px solid #0d8cbc;background-color:#10aeea;color:#ffffff !important;text-decoration:none !important;" >
<singleline style="color:#ffffff !important;" label="Book Now" >Book Now</singleline>
</p>
</td>
<!-- Table Padding --><td valign="top" background="#000000"></td><!-- Table Padding END -->
<td bgcolor="#ffffff" valign="top" style="border-radius: 5px;width: 30%;max-width: 30%;"><p style="margin:0px;font-size:14px;text-align:center;" ><img editable src="" style="margin-top:10px !important;margin-bottom:10px !important;" vspace="0" hspace="0" alt="Image 3" width="100%" label="Image Left" /></p>
<p style="color:#333333 !important; font-family:arial, 'veranda', san-serif; text-align:left;" >
<multiline style="color:#333333 !important;" label="Main Body Text">Consectetur adipiscing elit. Phasellus a ipsum a risus volutpat placerat in nec mauris. Fusce sit</multiline></p>
<p style="margin:0px;line-height:24px;font-size:14px;font-family:arial, 'veranda', san-serif;margin-top:20px;padding:5px;text-align:center;border-radius:5px;border:1px solid #0d8cbc;background-color:#10aeea;color:#ffffff !important;text-decoration:none !important;" >
<singleline style="color:#ffffff !important;" label="Book Now" >Book Now</singleline>
</p>
</td>
<!-- Table Padding --><td valign="top" background="#000000"></td><!-- Table Padding END -->
<td bgcolor="#ffffff" valign="top" style="border-radius: 5px;width: 30%;max-width: 30%;"><p style="margin:0px;font-size:14px;text-align:center;" ><img editable src="" style="margin-top:10px !important;margin-bottom:10px !important;" vspace="0" hspace="0" alt="Image 3" width="100%" label="Image Left" /></p>
<p style="color:#333333 !important; font-family:arial, 'veranda', san-serif; text-align:left;" >
<multiline style="color:#333333 !important;" label="Main Body Text">Consectetur adipiscing elit. Phasellus a ipsum a risus volutpat placerat in nec mauris. Fusce sit</multiline></p>
<p style="margin:0px;line-height:24px;font-size:14px;font-family:arial, 'veranda', san-serif;margin-top:20px;padding:5px;text-align:center;border-radius:5px;border:1px solid #0d8cbc;background-color:#10aeea;color:#ffffff !important;text-decoration:none !important;" >
<singleline style="color:#ffffff !important;" label="Book Now" >Book Now</singleline>
</p>
</td>
</tr>
</table>
</td>
</tr>
</table></layout><!--/section 2-->
<!--section 1-->
<layout label="Plain Title">
<table cellspacing="0" border="0" cellpadding="0" width="100%">
<tr>
<td valign="top" align="left"><h1 style="font-weight:bold;mso-line-height-rule:exactly;line-height:2;margin-bottom:10px;margin-top:0px;font-family:arial, 'veranda', san-serif;color:#ffffff;font-size:25px;">
<singleline label="Title">Lorem ipsum</singleline>
</h1></td>
</tr>
</table>
</layout>
<!--/section 1--><!--section 5-->
<layout label="Image Right">
<table cellspacing="0" border="0" cellpadding="0" width="100%" style="margin:10px 0px;">
<tr>
<td><table cellspacing="0" border="0" cellpadding="0" width="100%">
<tr>
<td valign="top" width="50%"><p style="text-align:right;margin:0px;color:#ffffff !important;mso-line-height-rule:exactly;line-height:22px;font-size:16px;font-family:arial, 'veranda', san-serif;" >
<multiline label="Main Body Text">Consectetur adipiscing elit. Phasellus a ipsum a risus volutpat placerat in nec mauris. Fusce sit amet enim erat, in sagittis arcu. Aliquam dolor dolor, semper id tempor et, varius pulvinar tellus. Maurtis commodo urna at dui bibendum quis euismod velit egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere</multiline>
</p></td>
<td valign="top" width="50%" style="padding-left:10px;"><img editable src="" vspace="0" hspace="0" style="display:block;" alt="Image 4" width="100%" label="Image Right" /></td>
</tr>
</table></td>
</tr>
</table>
</layout>
<!--/section 5--><!--section 3-->
<layout label="Image Left">
<table cellspacing="0" border="0" cellpadding="0" width="100%" style="margin:10px 0px;">
<tr>
<td><table cellspacing="0" border="0" cellpadding="0" width="100%">
<tr>
<td valign="top" width="50%" style="padding-right:10px;"><img editable src="" vspace="0" hspace="0" style="display:block;" alt="Image 5" width="100%" label="Image Left" /></td>
<td valign="top" width="50%"><p style="text-align:left;margin:0px;color:#ffffff !important;mso-line-height-rule:exactly;line-height:22px;font-size:16px;font-family:arial, 'veranda', san-serif;" >
<multiline label="Main Body Text">Consectetur adipiscing elit. Phasellus a ipsum a risus volutpat placerat in nec mauris. Fusce sit amet enim erat, in sagittis arcu. Aliquam dolor dolor, semper id tempor et, varius pulvinar tellus. Maurtis commodo urna at dui bibendum quis euismod velit egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere</multiline>
</p></td>
</tr>
</table></td>
</tr>
</table>
</layout>
<!--/section 3--></repeater></td>
</tr>
</table>
<!--/email content--></td>
</tr>
</table>
<!--/email container--><!--footer-->
<table width="600" border="0" align="center" cellpadding="30" cellspacing="0">
<tr>
<tr style="margin-top:20px;">
<hr style="margin-top:30px;border:1px solid #353535 !important;" />
</tr>
<td valign="top"><p style="margin:0px;color:#353535 !important;font-family:arial, 'veranda', san-serif;line-height:24px;font-size:14px;" > You’re receiving this newsletter because you’ve subscribed to our newsletter<br />
Not interested anymore?<br />
<unsubscribe style="text-decoration:none;color:#10aeea !important;" href="#" >Unsubscribe instantly.</unsubscribe>
</p></td>
<td valign="top" ><a style="text-decoration:none !important;color:#fff !important;margin:5px;position:relative;float:right;display:block;height:43px;width:42px;" href="https://www.facebook.com/pages/gocityhotelscom/343073452495484"> <img style="display:block;" alt="Facebook Image" vspace="0" hspace="0" src="facebook-mini-icon.jpg" /></a> <a style="text-decoration:none !important;color:#fff !important;margin:5px;position:relative;float:right;display:block;height:42px;width:42px;" href="https://twitter.com/gocityhotels"> <img style="display:block;" vspace="0" hspace="0" alt="Twitter Image" src="twitter-mini-icon.jpg" /></a></td>
</tr>
</table>
<!--/footer--></td>
</tr>
</table>
<!--/100% body table--></td>
</tr>
</table>
</div>
<style type="text/css">
.ReadMsgBody {width: 100%;}
.ExternalClass {width: 100%;}
a:hover {text-decoration: none !important;}
a { color:#fff !important; text-decoration: none !important;}
p {font-size: 14px; line-height: 24px; font-family: arial, 'veranda', san-serif !important; color: #ffffff !important; margin: 0px;}
span.yshortcuts { color:#000; background-color:none; border:none;}
span.yshortcuts:hover,
span.yshortcuts:active,
span.yshortcuts:focus {color:#000; background-color:none; border:none;}
</style>
</body>
</html>
此外，任何人都可以推荐任何可以让您检查代码或类似内容的服务，以实际解决根本问题，而不是只是随机修复。
答案 0 :(得分：0)
Outlook 2007与＆＃39; 10和＆＃13; 13相同，所以我打赌你在这三个问题上都有同样的问题。
查看this link - 有一些流量模板示例已应用最大宽度并适用于所有主要电子邮件客户端。
撕掉身体和包装纸，你应该好好去。