0
我正在使用電子郵件模板,該電子郵件模板的左側有一張圖片,右側有文本段。第一幅圖像和右側的段落沒有按照縮小屏幕的大小進行排列。它看起來很奇怪。但是,相同的屬性對於其餘的行正常工作。他們都按照期望的順序排列。響應電子郵件模板不工作
* {
margin-top: 0px;
margin-bottom: 0px;
padding: 0px;
border: none;
line-height: normal;
outline: none;
list-style: none;
-webkit-text-size-adjust: none;
-ms-text-size-adjust: none;
}
body {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
width: 100% !important;
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
-webkit-font-smoothing: antialiased !important;
}
table {
border-collapse: collapse !important;
padding: 0px !important;
border: none !important;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
}
table td {
border-collapse: collapse;
mso-line-height-rule: exactly;
}
.ExternalClass* {
line-height: 100% !important;
}
img {
border: 0 !important;
outline: none !important;
display: block !important;
}
.view_text a {
text-decoration: underline;
color: #f06022;
}
.forward_text a {
text-decoration: underline;
color: #7fc413;
}
.top_text a {
text-decoration: none;
color: #000000;
}
.read_more a {
text-decoration: none;
color: #ffffff;
}
.web_text a {
text-decoration: none;
color: #8b8b8b;
}
.manage_text a {
text-decoration: underline;
color: #8b8b8b;
}
.mail_text a {
text-decoration: underline;
color: #f06122;
}
table .main_table {
width: 650px;
}
@media only screen and (min-width: 481px) and (max-width: 600px) {
table[class=main_table] {
width: 480px !important;
}
table[class=wrapper] {
width: 100% !important;
}
td[class=hide],
span[class=hide],
br[class=hide] {
display: none !important;
}
td[class=pad_btm] {
padding-bottom: 25px !important;
}
td[class=spacer] {
width: 10px !important;
}
td[class=txt_dvd] {
text-align: center !important;
}
table[class=contact] {
width: 225px !important;
}
}
@media only screen and (max-width: 480px) {
table[class=main_table] {
width: 320px !important;
}
table[class=wrapper] {
width: 100% !important;
}
td[class=logo],
img[class=logo] {
width: 125px !important;
height: auto !important;
}
td[class=pad_btm] {
padding-bottom: 25px !important;
}
td[class=**_txt] {
font-size: 18px !important;
}
td[class=txt_dvd] {
text-align: center !important;
}
td[class=spacer] {
width: 10px !important;
}
td[class=hide],
span[class=hide],
br[class=hide] {
display: none !important;
}
td[class=mob_height] {
height: 5px !important;
}
table[class=contact] {
width: 225px !important;
}
}
<body marginwidth="0" marginheight="0" style="margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; width: 100% !important;-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;" offset="0" topmargin="0"
leftmargin="0" bgcolor="#ffffff">
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td valign="top">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td align="left" valign="top">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td class="hide" height="1" style="line-height:1px; min-width: 600px;">
<img src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/78d51c00-1e8b-428c-a4ed-a3430ed9f46a.gif" width="600" height="1" alt="" style="max-height:1px; min-height:1px; display:block; width:600px; min-width:600px;" border="0">
</td>
</tr>
<tr>
<td>
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td></td>
<td height="10" style="line-height:0px; font-size:0px;"> </td>
<td></td>
</tr>
<tr>
<td width="36" class="spacer"></td>
<td align="left" valign="top">
<table width="578" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="400" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:11px; line-height:normal; color:#000000; text-align:left;" mc:edit="top_text">Be sure to add <span class="top_text"><a href="mailto:[email protected]*.com" style="text-decoration:none; color:#000000;">[email protected]*.com</a></span> to
<br>your address book or safe sender list so our emails get to your inbox.</td>
</tr>
</table>
<table width="150" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td height="6" style="line-height:0px; font-size:0px;"> </td>
</tr>
<tr>
<td align="right" valign="middle" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:11px; line-height:normal; font-weight:bold; color:#f06022; text-align:right;" mc:edit="verson_text"><span class="view_text"><a href="*|ARCHIVE|*" target="_blank" style="text-decoration:underline; color:#f06022;">View online</a></span> <span class="forward_text"><a href="*|FORWARD|*" target="_blank" style="text-decoration:underline; color:#7fc413;">Forward</a></span>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="36" class="spacer"></td>
</tr>
<tr>
<td></td>
<td height="8" style="line-height:0px; font-size:0px;"> </td>
<td></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" valign="top" bgcolor="#000000">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td></td>
<td height="30"></td>
<td></td>
</tr>
<tr>
<td width="71" class="spacer"></td>
<td align="center" valign="top">
<a href="http://www.*.com.au" target="_blank">
<img mc:edit="top_logo" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/1b44993e-ab5b-4da1-9cc4-a38fff4ae839.png" alt="Direct Sites Online" border="0" style="display:block; width:100%;">
</a>
</td>
<td width="64" class="spacer"></td>
</tr>
<tr>
<td></td>
<td height="32"></td>
<td></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" valign="top" bgcolor="#f2f2f2">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td></td>
<td height="28"></td>
<td></td>
</tr>
<tr>
<td width="20" class="spacer"></td>
<td align="left" valign="top">
<table width="595" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="dear_text">
<table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td colspan="2" align="left" valign="top" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="dear_text">*|IF:FNAME|*Dear *|TITLE:FNAME|*,*|ELSE:|*Hello,*|END:IF|*
</td>
</tr>
<tr>
<td width="210" height="304" align="center" valign="top" class="pad_btm">
<img mc:edit="consider" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/4df8680f-973f-4c60-9412-7b953535d5a0.jpg" width="200" height="304" alt="xmas" border="0" style="display:block;">
</td>
<td width="370" align="left" valign="top" style="font-family:Arial, sans-serif; font-size:14px; color:#0f0f0f; line-height:18px; text-align:justify;" mc:edit="dear_text">
<p align="justify" style="padding:0px 0px;text-align:justify;">As famously once said, 「If you’re interested in the living heart of what you do, focus on building things rather than talking about them.」
<br>
<br>In this month's newsletter we have a great article on what not to do when revamping or starting out with a new web site design for your business. Also how to start incorporating local SEO (search engine optimisation)
in the success strategy for your business.</p>
<p align="justify" style="padding:0px 0px;text-align:justify;">
<br>As always, if you would like further information or assistance please feel free to contact us. If you would like to implement and or discuss any of the articles or recommendations in our newsletter please feel free to
contact us.</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="22"></td>
</tr>
<tr>
<td align="left" valign="top">
<table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="260" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:15px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="with_text">With thanks and best regards,</td>
</tr>
<tr>
<td height="18"></td>
</tr>
<tr>
<td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:15px; color:#0f0f0f; font-weight:bold; line-height:18px; text-align:left;" mc:edit="peter_text">Peter N. Flint</td>
</tr>
<tr>
<td height="18" style="line-height:0px; font-size:0px;"> </td>
</tr>
</table>
<table width="180" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="180" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="26" align="left" valign="top">
<a href="http://www.facebook.com/*" target="_blank">
<img mc:edit="fb" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/d93affec-486e-4020-aa6e-7aa2d320cc6d.jpg" width="26" height="26" alt="Facebook" border="0" style="display:block;">
</a>
</td>
<td width="5"></td>
<td width="26" align="left" valign="top">
<a href="https://twitter.com/DirectSites" target="_blank">
<img mc:edit="tweet" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/30d7dafd-8973-4bd4-a174-d7ad09a1f48c.jpg" width="26" height="26" alt="Twitter" border="0" style="display:block;">
</a>
</td>
<td width="5"></td>
<td width="26" align="left" valign="top">
<a target="_blank">
<img mc:edit="sky" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/ae3d2cb4-9d8e-477a-9407-ad1f58ab0e22.jpg" width="26" height="26" alt="Skype" border="0" style="display:block;">
</a>
</td>
<td width="4"></td>
<td width="26" align="left" valign="top">
<a href="https://plus.google.com/100692187112615457693/posts" target="_blank">
<img mc:edit="google" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/bd2d9723-43f8-43c4-bd53-c018a047c4b5.jpg" width="26" height="26" alt="Google Plus" border="0" style="display:block;">
</a>
</td>
<td width="5"></td>
<td width="26" align="left" valign="top">
<a href="http://www.linkedin.com/company/direct-sites-online" target="_blank">
<img mc:edit="linked" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/d6c04a93-f07a-4d41-83a8-29471d1e62fe.jpg" width="26" height="26" alt="Linkedin" border="0" style="display:block;">
</a>
</td>
<td width="5"></td>
<td width="26" align="left" valign="top">
<a href="https://www.youtube.com/user/*" target="_blank">
<img mc:edit="you" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/511a6d1b-f46d-4fdd-9612-4fd5ccad8220.jpg" width="26" height="26" alt="You Tube" border="0" style="display:block;">
</a>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="10" style="line-height:0px; font-size:0px;"> </td>
</tr>
<tr>
<td align="right" valign="top">
<table width="113" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="center" valign="top">
<a href="http://www.*.com.au" target="_blank">
<img mc:edit="**" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/1bb167db-01ff-4cda-aaf4-b30dc1d14605.jpg" width="113" height="19" alt="Direct Sites Online">
</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="35" class="spacer"></td>
</tr>
<tr>
<td></td>
<td height="32"></td>
<td></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" valign="top">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table" mc:repeatable="">
<tr>
<td align="left" valign="top">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td align="left" valign="top" bgcolor="#f06122">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td></td>
<td height="26"></td>
<td></td>
</tr>
<tr>
<td width="35" class="spacer"></td>
<td align="left" valign="top" class="**_txt" style="font-family:Arial, sans-serif; font-size:23px; color:#ffffff; line-height:normal; text-align:center;" mc:edit="**_news"><span style="font-weight:bold;">**</span> News and <span style="font-weight:bold;">BLOG</span> articles</td>
<td width="25" class="spacer"></td>
</tr>
<tr>
<td></td>
<td height="26"></td>
<td></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="30"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" valign="top">
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
<tr>
<td width="35" class="spacer"></td>
<td align="left" valign="top">
<table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="219" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td height="5" style="line-height:0px; font-size:0px;" class="hide"> </td>
</tr>
<tr>
<td align="center" valign="top" class="pad_btm">
<a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank">
<img mc:edit="consider" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/c4a9748a-32b7-4500-97a6-a67b42c76030.png" width="219" height="146" alt="Tis the season for email marketing" border="0"
style="display:block;">
</a>
</td>
</tr>
</table>
<table width="340" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:18px; color:#f06022; line-height:normal; text-align:left;" mc:edit="website_text">Start incorporating local seo in the success strategy for your business</td>
</tr>
<tr>
<td height="10" style="line-height:0px; font-size:0px;"> </td>
</tr>
<tr>
<td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="building_text">You have probably heard about SEO (stands for Search Engine Optimisation), but how about local SEO? Do you know the difference between the two? Well, one thing is for sure, and that is that SEO optimizes the content
of your website according to the requirements of search engines so that they will appear in search result inquiries.
<br class="hide">
<a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank" style="text-decoration:none; color:#ffffff;"><span style="color:#5e5e5e; line-height:18px;">Continue Here - Read more of this article which is located on our blog.</span></a>
</td>
</tr>
<tr>
<td height="22" style="line-height:0px; font-size:0px;"> </td>
</tr>
<tr>
<td align="left" valign="top">
<table width="132" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="132" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="8" align="left" valign="top">
<img mc:edit="curve" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/18ca4c30-13b9-46c8-94eb-2f763c7cd6f3.png" width="8" height="35" alt="" border="0" style="display:block;">
</td>
<td align="center" valign="middle" bgcolor="#000000" class="read_more" style="font-family:Arial, sans-serif; background-color:#000000; font-size:14px; color:#ffffff; line-height:18px; text-align:center;" mc:edit="more_text"><a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank" style="text-decoration:none; color:#ffffff; display:block;">Read More</a>
</td>
<td width="8" align="left" valign="top">
<img mc:edit="curve1" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/b06c0f3e-b1af-4af8-b110-da2c5cf37e47.png" width="8" height="35" alt="" border="0" style="display:block;">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
請分享小提琴 – ARJUN
@ARJUN什麼是'小提琴'?不確定,我對電子郵件編輯頗爲陌生,只是希望聖誕節圖像在屏幕尺寸減小時移動到文本上方。請幫忙。謝謝。 – yuvi707