HTML | 分享几个HTML邮件样式模板

我的微信公众号：知行校园汇，点击查看，欢迎关注

我的其他平台（点击蓝字可访问）：

GitHub 　｜　 Gitee 　｜　 哔哩哔哩 　｜　语雀　｜　简书　｜　 微信小程序 　｜　 知行达摩院

最近在写一个项目，要个用户发送验证码、通知等信息。

但是，以往只是文字堆砌，偶尔加个换行br。略显粗糙。

然后，偶然间看到了一些平台的通知邮件，然后就把他们的邮件扒出来，用一下哈哈哈…

注：以下模板，主要来自：腾讯企业邮箱、腾讯云的通知邮件。

1. Demo截图

第1个demo截图

第2个demo截图：

发送给对方后，对方收到的邮件是这样的：

第3个Demo截图

第4个Demo截图

第5个Demo

2. 代码

第1个demo代码：

<div><includetail><div style="font:Verdana normal 14px;color:#000;"><div style="position:relative;"><div class="eml-w eml-w-sys-layout">{{--页眉--}}<div style="font-size: 0px;">{{--分割线--}}<div class="eml-w-sys-line"><div class="eml-w-sys-line-left"></div><div class="eml-w-sys-line-right"></div></div>{{--  LOGO --}}<div class="eml-w-sys-logo"><img src="https://rescdn.qqmail.com/node/wwqy/qymng/style/images/sass/independent/welcome_eml_logo.png" style="width: 34px; height: 24px;" onerror=""></div></div>{{--以下写正文--}}<div class="eml-w-sys-content">{{--以下写正文--}}<div class="dragArea gen-group-list">{{-- 普通的文本  --}}<div class="gen-item"><div class="eml-w-item-block" style="padding: 0px;"><div class="eml-w-phase-normal-16">你好，张三，你的注册验证码为：</div></div></div>{{-- 普通的文本【自定义样式】  --}}<div class="gen-item">{{-- padding:行间距 --}}<div class="eml-w-item-block" style="padding: 10px;"><div class="eml-w-phase-normal-16" style="color: red;text-align: center;font-weight:bold"> 123456 </div></div></div>{{-- 普通的文本【自定义样式】  --}}<div class="gen-item">{{-- padding:行间距 --}}<div class="eml-w-item-block" style="padding: 0px;"><div class="eml-w-phase-normal-16" style="color: red;text-align: center;font-weight:bold;font-size: 20px"> 123456 </div></div></div>{{--  一级标题  --}}<div class="gen-item"><div class="eml-w-item-block" style="padding: 0px;"><div class="eml-w-title-level1">一、通用功能</div></div></div>{{--  二级标题，以及正文--}}<div class="gen-item" draggable="false"><div class="eml-w-item-block" style="padding: 0px 0px 0px 1px;">{{--  二级标题--}}<div class="eml-w-title-level3">1. 管理后台 “域名管理” 优化</div>{{--  二级标题里的小字号正文  --}}<div><div class="eml-w-phase-small-normal"><p>· 新增“管理记录”，可以查看域名注册、实名审核、续费等记录。</p></div></div></div></div>{{--显示图片--}}<div class="gen-item" draggable="false"><div class="eml-w-item-block" style="padding: 0px;"><div class="eml-w-picture-wrap"><img src="https://qy-eml-render-1258476243.cos.ap-guangzhou.myqcloud.com/images/sys/202114/pic1%402x.png"class="eml-w-picture-full-img" style="max-width: 100%;" draggable="false" onerror=""></div></div></div></div></div>{{--  署名  --}}<div class="eml-w-sys-footer">腾讯企业邮团队</div></div>{{--                <img src="//exmail.qq.com/qy_mng_logic/reportKV?type=NewFeatureNotify0731&amp;itemName=NewFeatureNotify0731" style="width:1px;height:1px;display:none;" onerror="">--}}</div></div><!--<![endif]--></includetail>
</div><style>.eml-w .eml-w-phase-normal-16 {color: #2b2b2b;font-size: 16px;line-height: 1.75}.eml-w .eml-w-phase-bold-16 {font-size: 16px;color: #2b2b2b;font-weight: 500;line-height: 1.75}.eml-w-title-level1 {font-size: 20px;font-weight: 500;padding: 15px 0}.eml-w-title-level3 {font-size: 16px;font-weight: 500;padding-bottom: 10px}.eml-w-title-level3.center {text-align: center}.eml-w-phase-small-normal {font-size: 14px;color: #2b2b2b;line-height: 1.75}.eml-w-picture-wrap {padding: 10px 0;width: 100%;overflow: hidden}.eml-w-picture-full-img {display: block;width: auto;max-width: 100%;margin: 0 auto}.eml-w-sys-layout {background: #fff;box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .2);border-radius: 4px;margin: 50px auto;max-width: 700px;overflow: hidden}.eml-w-sys-line-left {display: inline-block;width: 88%;background: #2984ef;height: 3px}.eml-w-sys-line-right {display: inline-block;width: 11.5%;height: 3px;background: #8bd5ff;margin-left: 1px}.eml-w-sys-logo {text-align: right}.eml-w-sys-logo img {display: inline-block;margin: 30px 50px 0 0}.eml-w-sys-content {position: relative;padding: 20px 50px 0;min-height: 216px;word-break: break-all}.eml-w-sys-footer {font-weight: 500;font-size: 12px;color: #bebebe;letter-spacing: .5px;padding: 0 0 30px 50px;margin-top: 60px}.eml-w {font-family: Helvetica Neue, Arial, PingFang SC, Hiragino Sans GB, STHeiti, Microsoft YaHei, sans-serif;-webkit-font-smoothing: antialiased;color: #2b2b2b;font-size: 14px;line-height: 1.75}.eml-w a {text-decoration: none}.eml-w a, .eml-w a:active {color: #186fd5}.eml-w h1, .eml-w h2, .eml-w h3, .eml-w h4, .eml-w h5, .eml-w h6, .eml-w li, .eml-w p, .eml-w ul {margin: 0;padding: 0}.eml-w-item-block {margin-bottom: 10px}@media (max-width: 420px) {.eml-w-sys-layout {border-radius: none !important;box-shadow: none !important;margin: 0 !important}.eml-w-sys-layout .eml-w-sys-line {display: none}.eml-w-sys-layout .eml-w-sys-logo img {margin-right: 30px !important}.eml-w-sys-layout .eml-w-sys-content {padding: 0 35px !important}.eml-w-sys-layout .eml-w-sys-footer {padding-left: 30px !important}}
</style>

第2个demo代码：

<div><includetail><div style="font:Verdana normal 14px;color:#000;"><div style="position:relative;">{{--  邮件的样式  --}}<style>.title_bold {font-family: PingFangSC-Medium, "STHeitiSC-Light", BlinkMacSystemFont, "Helvetica", "lucida Grande", "SCHeiti", "Microsoft YaHei";font-weight: bold;}.mail_bg {background-color: #F5F5F5;}.mail_cnt {padding: 60px 0 160px;max-width: 700px;margin: auto;color: #2b2b2b;-webkit-font-smoothing: antialiased;}.mail_container {background-color: #fff;margin: auto;max-width: 702px;border-radius: 2px;}.eml_content {padding: 0 50px 30px 50px;font-family: "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", sans-serif;}.mail_header {text-align: right;}.top_line_left {width: 88%;height: 3px;background-color: #2984EF;float: left;margin-right: 1px;border-top-left-radius: 2px;display: inline-block;}.top_line_right {width: 12%;height: 3px;background-color: #8BD5FF;float: right;border-top-right-radius: 2px;margin-top: -3px;}.main_title {font-size: 16px;line-height: 24px;}.main_subtitle {line-height: 28px;font-size: 16px;margin-bottom: 12px;}.item_level_1 {margin-top: 60px;}.item_level_2 {margin-top: 40px;}.level_1_title {font-size: 16px;line-height: 28px;}.level_2_title {font-size: 14px;line-height: 28px;font-weight: 600;}.item_txt {font-size: 14px;line-height: 28px;}.mail_footer {font-size: 12px;line-height: 17px;color: #bebebe;margin-top: 60px;letter-spacing: 1px;}.mail_logo {/*这里修改LOGO*/background-image: url("https://exmail.qq.com/zh_CN/htmledition/images/wwbiz_independent/notify_push/logo_2x.png");background-size: 34px 24px;width: 34px;height: 24px;background-repeat: no-repeat;display: inline-block;margin: 27px 0 20px 0;clear: left;}.img_position {max-width: 100%;}.normalTxt {font-size: 14px;line-height: 24px;margin-top: 10px;}@media (max-width: 768px) {.top_line {display: none;}.mail_bg {background: #fff;}.mail_cnt {padding-bottom: 0;padding-top: 0;}.eml_content {padding: 0 12px 50px;}.phoneFontSizeTitle {font-size: 18px !important;}.phoneFontSizeContent {font-size: 16px !important;line-height: 28px !important;}.phoneFontSizeTitleLarge {font-size: 20px !important;}.phoneFontSizeTips {font-size: 14px !important;}}</style><div class="qmbox"><div class="mail_bg"><div class="mail_cnt">{{--   邮件正文  --}}<div class="mail_container">{{--  上边的两个分割线  --}}<div class="top_line"><div class="top_line_left"></div><div class="top_line_right"></div></div>{{--   邮件正文  --}}<div class="eml_content">{{--   邮件LOGO  --}}<div class="mail_header"><div class="mail_logo"></div></div>{{--   邮件内容正文  --}}<div class="">{{--   普通正文  --}}<p style="font-size: 16px;margin-top:20px;" class="phoneFontSizeTitle">你好，张三</p>{{--   带加粗样式  --}}<p style="font-size: 16px;margin-top:10px;padding-bottom: 20px" class="title_bold phoneFontSizeTitle">腾讯企业邮新版本已发布，内容如下：</p>{{--   一级标题  --}}<div style="font-size: 20px;color: #2b2b2b;font-weight: bold;line-height: 28px;" class="phoneFontSizeTitleLarge">一、通用功能</div>{{--   二级标题带图  --}}<div style="margin-bottom: 40px;margin-top: 30px;overflow: hidden;"><div style="font-size: 16px;line-height: 28px;margin-bottom: 10px;" class="title_bold phoneFontSizeTitle">1. “系统日志-登录查询”优化</div><div style="font-size: 14px;line-height: 24px;" class="phoneFontSizeContent">· 支持查询具体管理员的登录记录。</div><div style="font-size: 14px;line-height: 24px;" class="phoneFontSizeContent">· 支持超级管理员和分级管理员查询。</div><div style="display: inline-block;margin-top: 20px;margin-bottom: 20px;"><img class="img_position" src="https://rescdn.qqmail.com/node/wwqy/qymng/style/images/sass/independent/newFeature2020120201b_2x.png" onerror=""></div></div></div>{{--   页脚信息  --}}<div class="mail_footer">腾讯企业邮团队</div></div></div>{{--   <img src="//exmail.qq.com/qy_mng_logic/reportKV?type=NewFeatureNotify0731&amp;itemName=mail_201203_openCnt" style="width:1px;height:1px;display:none;" onerror="">--}}</div></div></div></div></div><!--<![endif]--></includetail>
</div>

第3个Demo代码

<div><includetail><div align="center"><div class="open_email" style="margin-left: 8px; margin-top: 8px; margin-bottom: 8px; margin-right: 8px;"><div><br><span class="genEmailContent"><div id="cTMail-Wrap"style="word-break: break-all;box-sizing:border-box;text-align:center;min-width:320px; max-width:660px; border:1px solid #f6f6f6; background-color:#f7f8fa; margin:auto; padding:20px 0 30px; font-family:'helvetica neue',PingFangSC-Light,arial,'hiragino sans gb','microsoft yahei ui','microsoft yahei',simsun,sans-serif"><div class="main-content" style=""><table style="width:100%;font-weight:300;margin-bottom:10px;border-collapse:collapse"><tbody><tr style="font-weight:300"><td style="width:3%;max-width:30px;"></td><td style="max-width:600px;">{{--   LOGO  --}}<div id="cTMail-logo" style="width:92px; height:25px;">{{--   替换跳转链接  --}}<a href="">{{--   替换LOGO图片  --}}<img border="0" src="https://imgcache.qq.com/open_proj/proj_qcloud_v2/mc_2014/cdn/css/img/mail/logo-pc.png"style="width:92px; height:25px;display:block"></a></div>{{--   页面上边的蓝色分割线  --}}<p style="height:2px;background-color: #00a4ff;border: 0;font-size:0;padding:0;width:100%;margin-top:20px;"></p><div id="cTMail-inner" style="background-color:#fff; padding:23px 0 20px;box-shadow: 0px 1px 1px 0px rgba(122, 55, 55, 0.2);text-align:left;"><table style="width:100%;font-weight:300;margin-bottom:10px;border-collapse:collapse;text-align:left;"><tbody>{{--   第一个单元格  --}}<tr style="font-weight:300">{{--   左侧表格，设置左边距用的  --}}<td style="width:3.2%;max-width:30px;"></td>{{--   中间表格，正文使用  --}}<td style="max-width:480px;text-align:left;">{{--   以下是正文 --}}{{--   可以是标题  --}}<h1 id="cTMail-title" style="font-size: 20px; line-height: 36px; margin: 0px 0px 22px;">【XX平台】欢迎注册XXXXXX</h1><p id="cTMail-userName" style="font-size:14px;color:#333; line-height:24px; margin:0;">尊敬的XXX用户，您好！</p><p class="cTMail-content" style="line-height: 24px; margin: 6px 0px 0px; overflow-wrap: break-word; word-break: break-all;"><span style="color: rgb(51, 51, 51); font-size: 14px;">欢迎注册巴拉巴拉一大堆话。</span></p><p class="cTMail-content" style="line-height: 24px; margin: 6px 0px 0px; overflow-wrap: break-word; word-break: break-all;"><span style="color: rgb(51, 51, 51); font-size: 14px;">完成注册，请点击下面按钮验证邮箱。<span style="font-weight: bold;">非本人操作可忽略。</span></span></p>{{--   按钮  --}}<p class="cTMail-content"style="font-size: 14px; color: rgb(51, 51, 51); line-height: 24px; margin: 6px 0px 0px; word-wrap: break-word; word-break: break-all;">{{--   下面替换成自己的链接  --}}<a id="cTMail-btn" href="" title=""style="font-size: 16px; line-height: 45px; display: block; background-color: rgb(0, 164, 255); color: rgb(255, 255, 255); text-align: center; text-decoration: none; margin-top: 20px; border-radius: 3px;">点击此处验证邮箱</a></p><p class="cTMail-content" style="line-height: 24px; margin: 6px 0px 0px; overflow-wrap: break-word; word-break: break-all;"><span style="color: rgb(51, 51, 51); font-size: 14px;"><br>无法正常显示？请复制以下链接至浏览器打开：<br><a href="" title=""style="color: rgb(0, 164, 255); text-decoration: none; word-break: break-all; overflow-wrap: normal; font-size: 14px;">这里是激活账号的链接</a></span></p>{{--   来个署名  --}}<dl style="font-size: 14px; color: rgb(51, 51, 51); line-height: 18px;"><dd style="margin: 0px 0px 6px; padding: 0px; font-size: 12px; line-height: 22px;"><p id="cTMail-sender" style="font-size: 14px; line-height: 26px; word-wrap: break-word; word-break: break-all; margin-top: 32px;">此致<br><strong>XXX团队</strong></p></dd></dl></td>{{--   右侧表格，设置右边距用的  --}}<td style="width:3.2%;max-width:30px;"></td></tr></tbody></table></div>{{--   页面底部的推广  --}}<div id="cTMail-copy" style="text-align:center; font-size:12px; line-height:18px; color:#999"><table style="width:100%;font-weight:300;margin-bottom:10px;border-collapse:collapse"><tbody><tr style="font-weight:300">{{--   左，左边距  --}}<td style="width:3.2%;max-width:30px;"></td>{{--   中，正文  --}}<td style="max-width:540px;"><p style="text-align:center; margin:20px auto 14px auto;font-size:12px;color:#999;">此为系统邮件，请勿回复。{{--   可以加个链接  --}}<a href=""style="text-decoration:none;word-break:break-all;word-wrap:normal; color: #333;" target="_blank">取消订阅</a></p>{{--   可以加个图片，公众号二维码之类的  --}}<p id="cTMail-rights" style="max-width: 100%; margin:auto;font-size:12px;color:#999;text-align:center;line-height:22px;"><img border="0" src="http://imgcache.qq.com/open_proj/proj_qcloud_v2/tools/edm/css/img/wechat-qrcode-2x.jpg"style="width:64px; height:64px; margin:0 auto;"><br>关注服务号，移动管理云资源<br><img src="https://imgcache.qq.com/open_proj/proj_qcloud_v2/gateway/mail/cr.svg" style="margin-top: 10px;"></p></td>{{--   右，右边距  --}}<td style="width:3.2%;max-width:30px;"></td></tr></tbody></table></div></td><td style="width:3%;max-width:30px;"></td></tr></tbody></table></div></div></span>
{{--                    <br>--}}</div></div></div></includetail>
</div>

第4个Demo代码

<div><includetail><table style="font-family: Segoe UI, SegoeUIWF, Arial, sans-serif; font-size: 12px; color: #333333; border-spacing: 0px; border-collapse: collapse; padding: 0px; width: 580px; direction: ltr"><tbody><tr><td style="font-size: 10px; padding: 0px 0px 7px 0px; text-align: right">张三 现在正在共享您的 Microsoft&nbsp;365</td></tr><tr style="background-color: #0078D4"><td style="padding: 0px"><table style="font-family: Segoe UI, SegoeUIWF, Arial, sans-serif; border-spacing: 0px; border-collapse: collapse; width: 100%"><tbody><tr><td style="padding: 0px; width: 175px; max-width: 175px"><img src="https://omex.cdn.office.net/images/retailer.images/invite/4aa98a27d0d4978a.png"></td><td style="padding: 0px; width: 100%"></td><td style="padding: 0px; width: 107px; max-width: 107px"><img src="https://omex.cdn.office.net/images/retailer.images/invite/fd67eae9865f5f10.png"></td></tr><tr><td style="font-size: 38px; color: #FFFFFF; padding: 12px 22px 4px 22px" colspan="3">已接受邀请</td></tr><tr><td style="font-size: 20px; color: #FFFFFF; padding: 0px 22px 18px 22px" colspan="3">张三 现在正在共享您的 Microsoft&nbsp;365。</td></tr></tbody></table></td></tr><tr><td style="padding: 30px 20px; border-bottom-style: solid; border-bottom-color: #0078D4; border-bottom-width: 4px"><table style="font-family: Segoe UI, SegoeUIWF, Arial, sans-serif; font-size: 12px; color: #333333; border-spacing: 0px; border-collapse: collapse; width: 100%"><tbody><tr><td style="font-size: 12px; padding: 0px 0px 5px 0px">张三 和使用此订阅的所有人将获取:<ul style="font-size: 14px"><li style="padding-top: 10px">访问您的可用安装。</li><li>管理安装的帐户页面。</li><li>他们专属的 OneDrive 帐户，包含额外 1TB 的存储空间。</li></ul></td></tr><tr><td style="font-size: 12px; padding: 0px 0px 15px 0px">希望邀请更多人? 或删除一些人?<a href="" style="color: #0044CC; text-decoration: none">转到您的帐户页面。</a>您需要首先登录到您的 Microsoft 帐户。</td></tr><tr><td style="font-size: 12px; padding: 0px;">想要了解有关共享订阅的更多信息?<a href="" style="color: #0044CC; text-decoration: none">查看 Office 常见问题。</a></td></tr></tbody></table></td></tr><tr><td style="padding: 35px 0px; color: #B2B2B2; font-size: 12px">Microsoft Office<br>One Microsoft Way<br>Redmond, WA<br>98052 USA</td></tr><tr><td style="padding: 0px 0px 10px 0px; color: #B2B2B2; font-size: 12px">版权所有 Microsoft Corporation<br><a href="" style="color: #0044CC">隐私声明</a><br><a href="" style="color: #0044CC">需要帮助? 请与支持部门联系</a></td></tr></tbody></table></includetail>
</div>

第5个Demo代码

<div><includetail><style>/* CLIENT-SPECIFIC STYLES */body, table, td, a {-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;}table, td {mso-table-lspace: 0pt;mso-table-rspace: 0pt;}img {-ms-interpolation-mode: bicubic;}.hidden {display: none !important;visibility: hidden !important;}/* iOS BLUE LINKS */a[x-apple-data-detectors] {color: inherit !important;text-decoration: none !important;font-size: inherit !important;font-family: inherit !important;font-weight: inherit !important;line-height: inherit !important;}/* ANDROID MARGIN HACK */body {margin: 0 !important;}div[style*="margin: 16px 0"] {margin: 0 !important;}@media only screen and (max-width: 639px) {body, #body {min-width: 320px !important;}table.wrapper {width: 100% !important;min-width: 320px !important;}}</style><style>body {-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;}img {-ms-interpolation-mode: bicubic;}body {margin: 0 !important;}</style><table border="0" cellpadding="0" cellspacing="0" id="body"style="text-align: center; min-width: 640px; width: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; margin: 0; padding: 0;"bgcolor="#fafafa"><tbody>{{--  最上边紫色的分割线 --}}<tr class="line"><td style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; height: 4px; font-size: 4px; line-height: 4px; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt;"bgcolor="#6b4fbb">&nbsp;</td></tr>{{--  页头的LOGO    --}}<tr class="header"><td style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; font-size: 13px; line-height: 1.6; color: #5c5c5c; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 25px 0;"><img src="http://192.168.10.105/assets/mailers/gitlab_header_logo-153749eaa7ea6fafcb995161abd3247bc4c4500f31498b0c4024f50093983ac0.gif" width="55" height="50"style="-ms-interpolation-mode: bicubic;"></td></tr><tr><td style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt;"><table border="0" cellpadding="0" cellspacing="0" class="wrapper"style="width: 640px; border-collapse: separate; border-spacing: 0; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; margin: 0 auto;"><tbody><tr><td style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; border-radius: 3px; overflow: hidden; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 18px 25px; border: 1px solid #ededed;"align="left" bgcolor="#ffffff"><table border="0" cellpadding="0" cellspacing="0" class="content"style="width: 100%; border-collapse: separate; border-spacing: 0; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt;"><tbody><tr><td style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; color: #333333; font-size: 15px; font-weight: 400; line-height: 1.4; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 15px 5px;"align="center"><h1 style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; color: #333333; font-size: 18px; font-weight: 400; line-height: 1.4; margin: 0; padding: 0;"align="center">你好，张三！</h1><p>点击此链接重置密码：</p><div id="cta"><a href="" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;">点击此处重置链接</a></div><p>或复制此链接至浏览器打开：<a href="" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;">http://www.baidu.com</a></p></td></tr></tbody></table></td></tr></tbody></table></td></tr><tr class="footer"><td style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; font-size: 13px; line-height: 1.6; color: #5c5c5c; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 25px 0;"><img height="33" src="http://192.168.10.105/assets/mailers/gitlab_footer_logo-078860f148cc9596195e6bb3fa7db31c30538355576c5c3b569c414902e3d095.gif"style="display: block; -ms-interpolation-mode: bicubic; margin: 0 auto 1em;" width="90"><div>您收到这封电子邮件是因为你在 XX平台 拥有帐户。<a style="color: #3777b0; text-decoration: none; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;" href="">管理全部通知</a>·<a style="color: #3777b0; text-decoration: none; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;" href="http://192.168.10.105/help">帮助</a></div></td></tr></tbody></table></includetail>
</div>

以上。

HTML | 分享几个HTML邮件样式模板相关推荐

中文邮件营销html模版,怎么制作邮件营销模板？— —邮件格式
怎么制作邮件营销模板?- -邮件格式 U-Mail邮件营销平台发表时间 2017-09-21 人气 757次做EDM邮件营销,需要有好的邮件群发工具,还要有好的内容,那么如何制作好邮件营销的模板呢 ...
中文邮件格式模板、工作汇报邮件模板这样写，90%人都爱看
时常收发邮件的人都知道,邮件书写格式是一件很讲究的事,所以大家都要掌握基本的邮件格式模板. 如何书写一份得体的邮件? 原则:有礼貌.讲重点.条理清晰称呼:通常根据职位来称呼,xx经理.xx总.xx老 ...
WPF XAML 资源样式模板属性存放位置
WPF XAML 资源样式模板属性存放位置原文:WPF XAML 资源样式模板属性存放位置 WPF的XAML 资源申明类似HTML. 整体来说分3种 1.行类资源样式属性 1.1 行内属性 < ...
网上税务html模板,HTML黑色欧美形式税务动态邮件网页模板代码
模板描述:黑色欧美形式税务动态邮件.HTML黑色欧美形式税务动态邮件网页模板代码HTML模板下载代码结构 1. HTML代码 Lorem ipsum dolor sit amet, consec ...
自定义Word样式模板，设置为默认模板
文章目录前言一.具体操作步骤前言由于在大学毕业写论文的时候,论文格式的要求十分严格,但是在完成论文编辑之后,发现这个论文的格式样式对于今后word排版大有益处,于是就将该论文的格式样式保存在一 ...
基于国家标准的 EndNote 输出样式模板
发表于 2013-05-26 作者 Haoxian Zeng 浏览 983 次 from:http://cnzhx.net/blog/endnote-output-style-cnzhx/ 1 End ...
修改小程序swiper 点的样式_高质量的微信小程序样式模板应该长什么样？
现在不懂技术的小白若想快速制作自己的小程序,一般是通过小程序模板来实现.通过在模板上添加自己的图片.文字.商品等等,可以很简单地生成一个小程序.不过要想把小程序做得好看,你得找高质量的小程序样式模板才 ...
小程序长按api_高质量的微信小程序样式模板应该长什么样？
现在不懂技术的小白若想快速制作自己的小程序,一般是通过小程序模板来实现.通过在模板上添加自己的图片.文字.商品等等,可以很简单地生成一个小程序.不过要想把小程序做得好看,你得找高质量的小程序样式模板才 ...
小程序测试用例模板_微信小程序样式：高质量小程序样式模板大全
新手想要制作出美观的小程序,你需要多参考一些好看的微信小程序样式.今天就带大家分析几个高质量小程序的样式,看看别是怎么把小程序做得美观又吸引人的: 1.电商小程序样式电商小程序首页一般是按照&quo ...
Bella Email邮件发送模板
简介: Bella Email邮件发送模板是一款HTML5网站模板.aspku提示:本模板调用到谷歌字体库,可能会出现页面打开比较缓慢. 下载地址: http://www.bytepan.com/X3 ...

HTML | 分享几个HTML邮件样式模板

1. Demo截图

第1个demo截图

第2个demo截图：

第3个Demo截图

第4个Demo截图

第5个Demo

2. 代码

第1个demo代码：

第2个demo代码：

第3个Demo代码

第4个Demo代码

第5个Demo代码

HTML | 分享几个HTML邮件样式模板相关推荐

最新文章

热门文章