提问人:hakogg 提问时间:1/11/2023 最后编辑:Paulw11hakogg 更新时间:1/11/2023 访问量:51
全角电子邮件模板?
Full-Width E-mail Template?
问:
我最近收到一封电子邮件,在IOS G-Mail应用程序上显示为全角:
尝试重新创建时,它始终如下所示:
编辑:添加代码
<div role="article" style="background-color:#000">
<table role="presentation" style="width:100%;border:none;border-spacing:0">
<tr>
<td align="center" style="padding:0">
<table role="presentation" style="width:94%;max-width:600px;border:none;border-spacing:0;text-align:left;font-family:system-ui;font-size:16px;line-height:22px;color:#fff">
<tr>
</tr>
<tr>
<td>
<h1 style="margin-top:0;margin-bottom:16px;font-size:26px;line-height:32px;font-weight:bold;letter-spacing:-0.02em">Welcome to our responsive email!</h1>
<p style="margin:0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In tempus adipiscing felis, sit amet blandit ipsum volutpat sed. Morbi porttitor, <a href="http://www.example.com/" style="color:#e50d70;text-decoration:underline">eget accumsan dictum</a>, nisi libero ultricies ipsum, in posuere mauris neque at erat.</p>
</td>
</tr>
<tr>
<td style="padding:0;font-size:24px;line-height:28px;font-weight:bold">
<a href="http://www.example.com/" style="text-decoration:none"><img src="https://assets.codepen.io/210284/1200x800-2.png" width="600" alt="" style="width:100%;height:auto;border:none;text-decoration:none;color:#363636"></a>
</td>
</tr>
<tr>
<td style="padding:35px 30px 11px 30px;font-size:0;background-color:#ffffff;border-bottom:1px solid #f0f0f5">
<div class="col-sml" style="width:100%;max-width:145px;vertical-align:top;text-align:left;font-family:system-ui;font-size:14px;color:#363636">
<img src="https://assets.codepen.io/210284/icon.png" width="115" alt="" style="width:115px;max-width:80%;margin-bottom:20px">
</div>
<div class="col-lge" style="width:100%;max-width:395px;vertical-align:top;padding-bottom:20px;font-family:system-ui;font-size:16px;line-height:22px;color:#363636">
<p style="margin-top:0;margin-bottom:12px">Nullam mollis sapien vel cursus fermentum. Integer porttitor augue id ligula facilisis pharetra. In eu ex et elit ultricies ornare nec ac ex. Mauris sapien massa, placerat non venenatis et, tincidunt eget leo.</p>
<p style="margin-top:0;margin-bottom:18px">Nam non ante risus. Vestibulum vitae eleifend nisl, quis vehicula justo. Integer viverra efficitur pharetra. Nullam eget erat nibh.</p>
<p style="margin:0"><a href="https://example.com/" style="background: #ff3884;text-decoration: none;padding: 10px 25px;color: #ffffff;border-radius: 4px"><span style="font-weight:bold">Claim yours now</span></a></p>
</div>
</td>
</tr>
<tr>
<td style="padding:30px;font-size:24px;line-height:28px;font-weight:bold;background-color:#ffffff;border-bottom:1px solid #f0f0f5">
<a href="http://www.example.com/" style="text-decoration:none"><img src="https://assets.codepen.io/210284/1200x800-1.png" width="540" alt="" style="width:100%;height:auto;border:none;text-decoration:none;color:#363636"></a>
</td>
</tr>
<tr>
<td style="padding:30px;background-color:#ffffff">
<p style="margin:0">Duis sit amet accumsan nibh, varius tincidunt lectus. Quisque commodo, nulla ac feugiat cursus, arcu orci condimentum tellus, vel placerat libero sapien et libero. Suspendisse auctor vel orci nec finibus.</p>
</td>
</tr>
<tr>
<td style="padding:30px;text-align:center;font-size:12px;background-color:#404040;color:#cccccc">
<p style="margin:0 0 8px 0"><a href="http://www.facebook.com/" style="text-decoration:none"><img src="https://assets.codepen.io/210284/facebook_1.png" width="40" height="40" alt="f" style="color:#cccccc"></a> <a href="http://www.twitter.com/" style="text-decoration:none"><img src="https://assets.codepen.io/210284/twitter_1.png" width="40" height="40" alt="t" style="color:#cccccc"></a></p>
<p style="margin:0;font-size:14px;line-height:20px">® Someone, Somewhere 2021<br><a class="unsub" href="http://www.example.com/" style="color:#cccccc;text-decoration:underline">Unsubscribe instantly</a></p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
答: 暂无答案
评论