0
나는 HTML 이메일 작업을하고 있습니다. 일반적으로 테스트에서는 작동하지만 Outlook에서는 엉망이됩니다. 나는 여기에있는 질문을 보았고 그것에 상당한 양의 책을 읽었지 만, 다양한 수정을 시도한 후에는 아무 것도 효과가 없었습니다. 나는 Dreamweaver를 사용하여 총 초보자입니다, 그래서 코드 끔찍한 수 있습니다 알고Outlook에서 HTML 전자 메일 서식 지정 버그가 발생했습니다.
여기<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<!-- utf-8 works for most cases -->
<meta name="viewport" content="width=device-width">
<!-- Forcing initial-scale shouldn't be necessary -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Use the latest (edge) version of IE rendering engine -->
<title>EmailTemplate-Hybrid</title>
</head>
<body width="100%" bgcolor="#FFFFFF" style="margin: 0;" yahoo="yahoo">
<table cellpadding="0" cellspacing="0" border="0" height="100%" width="100%" bgcolor="#e0e0e0" style="border-collapse:collapse;">
<tr>
<td><center style="width: 100%;">
<!-- Visually Hidden Preheader Text : BEGIN -->
<div style="display:none;font-size:1px;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;mso-hide:all;font-family: sans-serif;"> Historic Renovation. </div>
<!-- Visually Hidden Preheader Text : END -->
<div style="max-width: 100%;">
<!--[if (gte mso 9)|(IE)]>
<table cellspacing="0" cellpadding="0" border="0" width"100%" align="center">
<tr>
<td>
<![endif]-->
<!-- Email Header : BEGIN -->
<table width="60%" height="auto" align="right">
</table></div></center></td><td style="font-size: 2.75vw;"><a style="color: black" href="http://www.ernstbrothers.com/gallery/residential/">GALLERY </a></td>
<td style="font-size: 2.75vw;"><a style="color: black" href="http://www.ernstbrothers.com/services/">SERVICES</a></td>
</tr></table>
<table class="container " width="100%">
<td>
<img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/b9d5dc85-0cfc-470f-a3e6-7abaffb8849d.jpg" width="100%">
</td>
</table>
<!-- Email Header : END -->
<!-- Email Body : BEGIN -->
<table width="100%">
<tr>
<td style="background: #FFFFFF; font-size: 4vw; font-family: serif; text-align: right " width="100%" height="125px"><blockquote>
<p><a style="color: black" href="http://ernstbrothers.com/blog/solebury-guest-house-part-18th-century-bones/">HISTORIC RENOVATION</a> </p>
</blockquote>
</td>
</tr>
</table>
<!-- 1 Column Text : BEGIN -->
<table width="100%">
<tr>
<td>
<img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/b1bd7d4c-a5f9-4081-a543-b94b4cf6d9d2.jpg" width="100%">
</td>
</tr>
<tr>
<td>
<a href="http://www.ernstbrothers.com/blog/solebury-guest-house-part-18th-century-bones/"><img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/328fa1bb-1858-4f8c-9c89-2002fd132365.jpg" alt="" width="100%"></a>
</td>
</tr>
</table>
<table>
<tr>
<td>
<h1 style="font-family: sans-serif; text-align: left; font-size: 4vw; line-height: auto; padding-top: 20px; padding-left: 20px; color: #000000;"> Another Project in <span style="color: #4CA7A0"><a style="color: teal" href="http://ernstbrothers.com/blog/solebury-guest-house-part-18th-century-bones/">Bucks County!</a></span></h1>
</td>
</tr>
<tr>
<td>
<p style="text-align: center; font-family: sans-serif; font-size: 3vw; line-height: auto; color: #000000"> Ernst Brothers is fulfilling the new owners vision for this property in Solebury, creating a serene guest house from the bones of this 18th-century farmhouse.</p>
</td>
</tr>
</table>
<!-- Button : Begin -->
<table cellspacing="0" cellpadding="0" border="0" align="right" style="margin: auto;">
<tr>
<td style="border-radius: 3px; background: #222222; text-align: center;" class="button-td"><a href="http://ernstbrothers.com/blog/solebury-guest-house-part-18th-century-bones/" style="background: #222222; border: 15px solid #222222; padding: 0 10px; color: #ffffff; font-family: sans-serif; font-size: 2.75vw; line-height: 1.1; text-decoration: none; display: block; border-radius: 3px; font-weight: bold;" class="button-a">
<!--[if mso]> <![endif]-->Read <span style="text-align: left"></span>More
<!--[if mso]> <![endif]-->
</a>
</td>
</tr>
</table>
<!-- Button : END -->
<!-- Visit US : BEGIN -->
<!-- Two Even Columns : END -->
<!-- Email Body : END -->
<!-- Email Footer : BEGIN -->
<table width="100%">
<tr>
<td>
<a href="http://www.ernstbrothers.com/contact-us/"><img style="padding-top: 40px; display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/374d5aa5-5dd8-4a96-89e2-2a392f6092c3.jpg" alt="" width="100%">
</a></td>
</tr>
<tr>
<td>
<a href="http://www.ernstbrothers.com/contact-us/"><img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/4441e9d8-1138-44e9-95ee-cd59c1019d9d.jpg" width="100%"></a>
</td>
</tr>
</table>
<table width="100%" height="200px" style="background: #FEFDFD">
<td style="text-align: center; font-family: 'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif; font-size: 4vw; line-height: auto;"><a style="color: black" href="http://maps.apple.com/?q=Ernst+Brothers&sll=40.186293,-75.227316&z=10&t=s"> 1104 North Bethlehem Pike <br>
Spring House, PA 19477</a></td>
</table>
<table width="100%" height="147" border="1" align="center" style="background-color: darkgrey">
<tbody>
<tr>
<td width="15%" align="center"><a href="https://www.instagram.com/ernstbrothers/"><img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/391b81fc-92ee-4072-b859-dc538485f046.png" alt="" width="80%"></a></td>
<td width="15%" align="center"><a href="https://www.facebook.com/ErnstBrothers/"><img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/e5447cda-cd97-45b1-9411-6703b985f3b2.png" alt="" width="80%"></a></td>
<td width="15%" align="center"><a href="https://twitter.com/ErnstBrothers"><img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/b88e145d-feda-4b66-86fe-6aea5083e760.png" alt="" width="80%"></a></td>
<td width="15%" align="center"><a href="https://www.houzz.com/pro/ernstbrothers/ernst-brothers"><img style="display: block" src="https://gallery.mailchimp.com/79b319fc2b7f0621f7b66caec/images/ba8cce9e-385a-4827-964d-fa608ffce6b2.png" alt="" width="80%"></a></td>
<td width"40%" style="font-size: 3vw; font-family: sans-serif; text-align: center"><a style="color: white" href="tel:+2154535124">215-453-5124</a></td>
</tr>
</tbody>
</table>
<!-- Email Footer : END -->
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
<center>
<br>
<br>
<br>
<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></body>
</html>
내 바탕 화면에 .html 중에서에서 크롬에서 열,보고 의도 방법이다. IMG
다음은 Outlook에서의 모습입니다. IMG2
모든 도움을 주시면 대단히 감사하겠습니다.
그러나 : 자세한 내용은
,이 이메일에 어떤 작품에 큰 자원이다? 일반 서식에 대해서만 말합니다. –
어쨌든 여기 전자 메일에 가이드 tu css : https://www.campaignmonitor.com/css/selectors/child/ –