我目前正在通过Mailchimp为我的博客的客户/关注者启动时事通讯，并且出现了一个问题。当电子邮件发送给使用默认iPhone电子邮件客户端的任何人时，图像会像这样歪斜。
我在单独的iOS客户端(航空邮件(上检查了电子邮件，看起来很好。它在Mailchimp的预览中看起来也不错，所以我猜这与Apple的默认客户端有关。有什么想法吗？
这是 HTML 和内联 CSS
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="https://gallery.mailchimp.com/70186f0a9db1e3d7b932ad84d/files/1e71bcad-6a84-4265-bb54-84188d0d027f/email1sheet.04.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="ult">
<div class="header">
<img src="https://gallery.mailchimp.com/70186f0a9db1e3d7b932ad84d/images/0a53d223-c847-49f6-97c3-2119430d3dce.png" alt="colorful banner" style="max-width: 100%">
</div>
<div class="body-div">
<p>Hi and welcome to my email list! Thanks for joining. This is just a simple welcome email, but let me tell you a little bit about myself. My name is Mason and I'm a graphic designer from Chicago, IL. I love good music, coffee, video games and, of course, design.
<br>
<br>
I’d like to thank you for joining by sharing some content that I think you might enjoy:</p>
<h1>Some Cool Resources</h1>
<p><b>Looking For Stock Photos?</b>
<br>Stock photos are expensive, for sure. I get it. I don’t want to pay for them either. Well, it turns out we’re all in luck. <a href="https://stocksnap.io">Stocksnap</a> is a great site that gives away a ton of high quality, high-res images for free. The pictures here are actually really good. Even as a designer, I’ll admit that I use some of them myself. Check the site out! No need to thank me.</p>
<br>
<p><b>Want To See Some Cool Design Work?</b>
<br>Try browsing <a href="https://dribbble.com">Dribbble</a> sometime. It’s a great site where you can see some very high quality work. Only users who have been invited to the site are allowed to post their work, so all the posts are guaranteed to be somewhat good, at the very least.<br><br>
If you want, give me a follow too! My Dribbble page is <a href="https://dribbble.com/MasonW">here</a>.</p>
<br>
<p><b>Need a New Podcast?</b>
<br>If you haven’t listened to <a href="http://99percentinvisible.org">99% Invisible</a> yet, you definitely need to check it out. This podcast is all about the various kinds of design we come across in life. It’ll help you look at the things you take for granted in life in a whole new way. Each episode is incredibly interesting in its own way. Also, the host, Roman Mars, exudes real passion and has one of the most relaxing voices of any podcast host I know. What’s more… episodes are usually only around 20 - 30 minutes long which is often times the perfect length for your commute to work or for a nice walk.</p>
<h1>Content From Yours Truly</h1>
<p>Thinking of working with a designer sometime soon? Check out a recent blog post of mine where I talk about The Do’s and Don’ts of Working With a Designer. Design can be a misunderstood field and hopefully this will give you a bit of insight.</p>
<br>
<center>
<div class="pic">
<a href="https://medium.com/@mason_weis/the-dos-and-donts-of-working-with-a-designer-on-your-next-project-9f322a53b8e"><img src="https://cdn-images-1.medium.com/max/1000/1*x_BVDlaWwsD0V5PdthkkkA.png" alt="Cover Art and link for my blog post" style="border-top-right-radius: 5px; border-top-left-radius: 5px; max-width: 100%; max-height: 100%; display: block;"></a>
<div class="card">Click above to give it a read!</div>
</div>
</center>
<br>
<h1>Until Next Time!</h1>
<p>Thanks again for subscribing! I’ll only be sending emails once a month, so don’t expect spam or anything like that. Feel free to reach out to me any time as well - my email is masonsweis94@icloud.com
Thanks!
<center>
<br>
<br>
<br>
<table border="0" cellpadding="0" cellspacing="0" width="100%" id="canspamBarWrapper" style="background-color:#FFFFFF; border-top:1px solid #E5E5E5;">
<tr>
<td align="center" valign="top" style="padding-top:20px; padding-bottom:20px;">
<table border="0" cellpadding="0" cellspacing="0" id="canspamBar">
<tr>
<td align="center" valign="top" style="color:#606060; font-family:Helvetica, Arial, sans-serif; font-size:11px; line-height:150%; padding-right:20px; padding-bottom:5px; padding-left:20px; text-align:center;">
This email was sent to <a href="mailto:*|EMAIL|*" target="_blank" style="color:#404040 !important;">*|EMAIL|*</a>
<br>
<a href="*|ABOUT_LIST|*" target="_blank" style="color:#404040 !important;"><em>why did I get this?</em></a> <a href="*|UNSUB|*" style="color:#404040 !important;">unsubscribe from this list</a> <a href="*|UPDATE_PROFILE|*" style="color:#404040 !important;">update subscription preferences</a>
<br>
*|LIST:ADDRESSLINE|*
<br>
<br>
*|REWARDS|*
</td>
</tr>
</table>
</td>
</tr>
</table>
<style type="text/css">
@media only screen and (max-width: 480px){
table#canspamBar td{font-size:14px !important;}
table#canspamBar td a{display:block !important; margin-top:10px !important;}
}
</style>
</center></p>
</div>
</div>
</body>
</html>如果您将宽度指定为 100%，则不要将最大高度或高度编码为 100%。高度应编码为自动。这意味着如果宽度为 100% 高度 uto 将意味着它将成比例。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="https://gallery.mailchimp.com/70186f0a9db1e3d7b932ad84d/files/1e71bcad-6a84-4265-bb54-84188d0d027f/email1sheet.04.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="ult">
<div class="header">
<img src="https://gallery.mailchimp.com/70186f0a9db1e3d7b932ad84d/images/0a53d223-c847-49f6-97c3-2119430d3dce.png" alt="colorful banner" style="max-width: 100%">
</div>
<div class="body-div">
<p>Hi and welcome to my email list! Thanks for joining. This is just a simple welcome email, but let me tell you a little bit about myself. My name is Mason and I'm a graphic designer from Chicago, IL. I love good music, coffee, video games and, of course, design.
<br>
<br>
I’d like to thank you for joining by sharing some content that I think you might enjoy:</p>
<h1>Some Cool Resources</h1>
<p><b>Looking For Stock Photos?</b>
<br>Stock photos are expensive, for sure. I get it. I don’t want to pay for them either. Well, it turns out we’re all in luck. <a href="https://stocksnap.io">Stocksnap</a> is a great site that gives away a ton of high quality, high-res images for free. The pictures here are actually really good. Even as a designer, I’ll admit that I use some of them myself. Check the site out! No need to thank me.</p>
<br>
<p><b>Want To See Some Cool Design Work?</b>
<br>Try browsing <a href="https://dribbble.com">Dribbble</a> sometime. It’s a great site where you can see some very high quality work. Only users who have been invited to the site are allowed to post their work, so all the posts are guaranteed to be somewhat good, at the very least.<br><br>
If you want, give me a follow too! My Dribbble page is <a href="https://dribbble.com/MasonW">here</a>.</p>
<br>
<p><b>Need a New Podcast?</b>
<br>If you haven’t listened to <a href="http://99percentinvisible.org">99% Invisible</a> yet, you definitely need to check it out. This podcast is all about the various kinds of design we come across in life. It’ll help you look at the things you take for granted in life in a whole new way. Each episode is incredibly interesting in its own way. Also, the host, Roman Mars, exudes real passion and has one of the most relaxing voices of any podcast host I know. What’s more… episodes are usually only around 20 - 30 minutes long which is often times the perfect length for your commute to work or for a nice walk.</p>
<h1>Content From Yours Truly</h1>
<p>Thinking of working with a designer sometime soon? Check out a recent blog post of mine where I talk about the The Do’s and Don’ts of Working With a Designer. Design can be a misunderstood field and hopefully this will give you a bit of insight.</p>
<br>
<center>
<div class="pic">
<a href="https://medium.com/@mason_weis/the-dos-and-donts-of-working-with-a-designer-on-your-next-project-9f322a53b8e"><img src="https://cdn-images-1.medium.com/max/1000/1*x_BVDlaWwsD0V5PdthkkkA.png" alt="Cover Art and link for my blog post" style="border-top-right-radius: 5px; border-top-left-radius: 5px; max-width: 100%; height:auto; display: block;"></a>
<div class="card">Click above to give it a read!</div>
</div>
</center>
<br>
<h1>Until Next Time!</h1>
<p>Thanks again for subscribing! I’ll only be sending emails once a month, so don’t expect spam or anything like that. Feel free to reach out to me any time as well - my email is masonsweis94@icloud.com
Thanks!
<center>
<br>
<br>
<br>
<table border="0" cellpadding="0" cellspacing="0" width="100%" id="canspamBarWrapper" style="background-color:#FFFFFF; border-top:1px solid #E5E5E5;">
<tr>
<td align="center" valign="top" style="padding-top:20px; padding-bottom:20px;">
<table border="0" cellpadding="0" cellspacing="0" id="canspamBar">
<tr>
<td align="center" valign="top" style="color:#606060; font-family:Helvetica, Arial, sans-serif; font-size:11px; line-height:150%; padding-right:20px; padding-bottom:5px; padding-left:20px; text-align:center;">
This email was sent to <a href="mailto:*|EMAIL|*" target="_blank" style="color:#404040 !important;">*|EMAIL|*</a>
<br>
<a href="*|ABOUT_LIST|*" target="_blank" style="color:#404040 !important;"><em>why did I get this?</em></a> <a href="*|UNSUB|*" style="color:#404040 !important;">unsubscribe from this list</a> <a href="*|UPDATE_PROFILE|*" style="color:#404040 !important;">update subscription preferences</a>
<br>
*|LIST:ADDRESSLINE|*
<br>
<br>
*|REWARDS|*
</td>
</tr>
</table>
</td>
</tr>
</table>
<style type="text/css">
@media only screen and (max-width: 480px){
table#canspamBar td{font-size:14px !important;}
table#canspamBar td a{display:block !important; margin-top:10px !important;}
}
</style>
</center></p>
</div>
</div>
</body>
</html>放手，让我知道它是否有效。