记录个人使用的Email HTML模板

邮件HTML真是难搞,这么多年不做新的语法支持。删删改改,最终写出了一套满意的,必须使用内联CSS样式和表格布局,旧属性旧语法真的很心累。

验证码邮件模板

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>{{.Title}}</title>
</head>

<body style="margin: 0; padding: 0;">
  <table border="0" cellpadding="0" cellspacing="0" width="100%"
    style="background-image: url('https://testingcf.jsdelivr.net/gh/4444TENSEI/CDN@master/img/background/pt/003.webp'); background-size: cover; background-position: center; background-repeat: no-repeat; height: 960px;">
    <tr>
      <td>
        <table border="0" cellpadding="0" cellspacing="0" width="600" align="center">
          <tr>
            <td align="center">
              <!-- 这里设置卡片宽度 -->
              <div style="max-width: 74%;width: auto; background-color: rgba(100, 120, 140, 0.6); padding: 36px 0; border-radius: 60px; text-align: center;
              -webkit-backdrop-filter: blur(10px);
              backdrop-filter: blur(10px);">
                <p
                  style="font-size: 36px; line-height: 1;margin:10px 0 32px 0; color: rgb(255, 255, 255);  background-color: rgba(255, 255, 255, 0);white-space: nowrap;">
                  您的{{.Purpose}}验证码是:
                </p>
                <p
                  style="font-size: 80px; line-height: 1;margin:0; color: rgb(255, 255, 255);  font-weight: 1000; background-color: rgba(255, 255, 255, 0);white-space: nowrap;">
                  {{.Captcha}}
                </p>
              </div>
            </td>
          </tr>
        </table>
      </td>
    </tr>
  </table>
</body>

</html>
暂无评论

发送评论 编辑评论


				
上一篇
下一篇