html 自适应邮件模板
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html 自适应邮件模板相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html>
<html lang="en">
<head>
<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>Adaptive email</title>
</head>
<body style="margin:0px;padding:0px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-colapse: colapse;">
<tr>
<td align="center">
<!--[if (gte mso 9)|IE]>
<table width="600" align="center">
<tr>
<td style="padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;margin:0px;">
<![endif]-->
<table align="center" border="0" cellspacing="0" cellpadding="0" style="border-colpase:colpase; width: 100%; max-width: 600px;">
<tr>
<td style="padding-top:20px; padding-bottom: 20px; padding-right: 30px; padding-left: 30px;
text-align: center; font-family: Arial, Verdana, sans-serif;line-height:32px; color:#222222;">
Title adaptive email
</td>
</tr>
<tr>
<td>
<img src="http://image.sendsay.ru/image/letter/examples/skolko-stoit-internet-magazin.jpg" width="600px" alt="" style="width: 100%;max-width:600px;height:auto;">
</td>
</tr>
<tr>
<td style="padding-top:0px;padding-bottom:20px;padding-right:0;padding-left:0;text-align:center;" >
<!--[if (gte mso 9)|(IE)]>
<table width="100%">
<tr>
<td width="50%" valign="top" >
<![endif]-->
<div class="column" style="width:100%;max-width:290px;display:inline-block;vertical-align:top;" >
<table width="100%" cellpadding="0" cellspacing="0" style="border-spacing:0;" >
<tr>
<td align="center" style="padding-top:10px;padding-bottom:5px;padding-right:5px;padding-left:5px;text-align:center;font-family: Arial, Helvetica, sans-serif;font-size:15px; line-height:18px; color:#222222;">
1 adaptive column
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]>
</td><td width="50%" valign="top" >
<![endif]-->
<div class="column" style="width:100%;max-width:290px;display:inline-block;vertical-align:top;">
<table width="100%" cellpadding="0" cellspacing="0" style="border-spacing:0;" >
<tr>
<td align="center" style="padding-top:10px;padding-bottom:5px;padding-right:5px;padding-left:5px;text-align:center;font-family: Arial, Helvetica, sans-serif;font-size:15px; line-height:18px; color:#222222;">
2 adaptive column
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
</table>
<!--[if (gte mso 9)|IE]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
</table>
</body>
</html>
以上是关于html 自适应邮件模板的主要内容,如果未能解决你的问题,请参考以下文章