分享一个好看的邮件html模板
2024-05-14 16:12:40
先给大家看看邮箱里的效果图：
模板HTML代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>邮件模板</title></head><body><div style="background: #F0F2F5; padding: 35px; font-size: 14px;"><div style="width: 750px; margin: 0 auto; background: url('https://www.henghost.com/images/hc_email_background.png') no-repeat center; background-size: cover;"><div style="padding: 0 15px; padding-bottom: 20px;"><div style="height: 80px; display: flex; justify-content: space-between; position: relative;"><div><a href="https://www.henghost.com/" target="_blank" rel="noopener"><img style="margin-top: 20px; width: 150px; height: 50px;" src="https://i.loli.net/2019/12/31/mJrcl1RbAk4p5sj.png" height="50" border="0"></a></div><div><div style="font-size: 14px; color: #bddaff; margin-top: 17px;">客户名称：韦君元</div><div style="height: 30px; color: #006eff; line-height: 30px; padding: 0 10px; background: #FFFFFF; position: absolute; bottom: 0px; right: 0px;">7*24h 服务热线：+852 5104 3232</div></div></div><div style="background: #fff; padding: 0 15px; padding-bottom: 50px;"><div style="padding: 0 9px; display: flex; justify-content: space-between; align-items: center; padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid #DBDBDB;"><div style="display: flex;"><a style="color: #333; text-decoration: none;" href="https://www.henghost.com/" target="_blank" rel="noopener"><span class="nav-title" style="margin-right: 50px;">恒创科技</span></a><a style="color: #333; text-decoration: none;" href="https://www.henghost.com/sales.shtml?emailbanner" target="_blank" rel="noopener"><span class="nav-title" style="margin-right: 50px;">最新活动</span></a><a style="color: #333; text-decoration: none;" href="https://www.henghost.com/help/article/" target="_blank" rel="noopener"><span class="nav-title" style="margin-right: 50px;">帮助文档</span></a><a style="color: #333; text-decoration: none;" href="http://wpa.b.qq.com/cgi/wpa.php?ln=1&key=XzkzODE4NTMxN180Nzk2MThfNDAwODYwNjA2OV8" target="_blank" rel="noopener"><span class="nav-title">联系我们</span></a></div><div style="display: flex;"><div style="cursor: pointer; background: #006EFF; color: #fff; height: 30px; line-height: 30px; padding: 0 10px; box-sizing: border-box; margin-left: 10px;"><a style="text-decoration: none; height: 100%; display: inline-block; color: inherit;" href="https://my.henghost.com/clientarea.php?s_url=https://my.henghost.com/clientarea.php?emailbanner" target="_blank" rel="noopener"> 控制台</a></div></div></div><div style="color: #41bf71; border: 1px solid #41BF71; background: #E0FFEC; padding: 14px 15px; display: flex; margin-top: 20px; margin-bottom: 30px;"><img style="width: 42px !important; height: 42px !important;" src="https://www.henghost.com/images/hc_console_normal.png" width="42"><div style="margin-left: 14px;"><div style="font-size: 16px; font-weight: bold; margin-bottom: 5px;">云服务器开通成功！感谢您对恒创科技的支持。</div><div style="width: 600px; line-height: 24px;"><a style="color: #006eff; text-decoration: none;" href="https://my.henghost.com/list.php" target="_blank" rel="noopener">登录控制台</a> 查看并使用您的云服务器。<a style="color: #006eff; text-decoration: none;" href="https://www.henghost.com/help/article/584/" target="_blank" rel="noopener">云服务器登录</a>、<a style="color: #006eff; text-decoration: none;" href="https://www.henghost.com/help/article/596/" target="_blank" rel="noopener">重装系统</a> 等操作请参阅：<a style="color: #006eff; text-decoration: none;" href="https://www.henghost.com/help/article_cate/29/" target="_blank" rel="noopener">操作指南</a>。</div></div></div><div><div><span style="font-size: 16px; font-weight: bold; position: relative; top: -4px;">产品信息</span></div><table style="width: 100%; border-spacing: 0px; border-collapse: collapse; border: none; margin-top: 20px;"><tbody><tr style="height: 40px; background: #F6F6F6;"><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">产品类型</th><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">区域</th><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">产品 ID</th><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">IP 地址</th></tr><tr style="height: 40px;"><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">云服务器</td><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">中国香港</td><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;"><a style="color: #006eff; text-decoration: none;" href="https://my.henghost.com/example.php?id=105807" target="_blank" rel="noopener">cloud105807</a></td><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">154.204.58.79</td></tr></tbody></table></div><div style="margin-top: 30px;"><div><span style="font-size: 16px; font-weight: bold; position: relative; top: -4px;">订单信息</span></div><table style="width: 100%; border-spacing: 0px; border-collapse: collapse; border: none; margin-top: 20px;"><tbody><tr style="height: 40px; background: #F6F6F6;"><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">付款金额</th><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">续费金额</th><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">开通时间</th><th style="border: 1px solid #DBDBDB; color: #666666; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">到期时间</th></tr><tr style="height: 40px;"><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">￥0.00元</td><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;">￥126.00元</td><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;"><span style="border-bottom: 1px dashed rgb(204, 204, 204); position: relative;" t="5" times="">2022/07/14</span></td><td style="border: 1px solid #DBDBDB; font-size: 14px; font-weight: normal; text-align: left; padding-left: 14px;"><span style="border-bottom:1px dashed #ccc;" t="5" times="">2022/08/21</span></td></tr></tbody></table></div><div style="margin-top: 30px;"><div><span style="font-size: 16px; font-weight: bold; position: relative; top: -4px;">产品配置：</span></div><div style="border: 1px solid #DBDBDB; padding: 10px; padding-bottom: 20px; margin-top: 20px;"><div style="line-height: 30px;"> 可用区: 香港二区 节点组: 香港1区 CPU: 1核心 内存: 2GB 云系统盘: 50G 公网IP数: 1个 BGP精品带宽: 2M 网络类型: 私有网络 VPC: 0 x 1 安全组: 0 x 1 系统镜像: Windows-2008R2-Datacenter-cn </div></div></div><div style="margin-top: 30px;"><span style="font-size: 14px; font-weight: bold;">温馨提示</span><div style="line-height: 24px; margin-top: 10px;"><div>使用过程中如有任何问题，欢迎通过<a style="color: #006eff; text-decoration: none;" href="http://wpa.b.qq.com/cgi/wpa.php?ln=1&key=XzkzODE4NTMxN180Nzk2MThfNDAwODYwNjA2OV8" target="_blank" rel="noopener"> 在线客服</a>、<a style="color: #006eff; text-decoration: none;" href="https://my.henghost.com/subworkorder.php" target="_blank" rel="noopener">提交工单</a>、香港热线等渠道随时联络我们。</div></div></div></div></div></div><table class="responsive-table" style="text-size-adjust: 100%; margin-top: 18px; border-collapse: collapse !important; width: 100%;" border="0" cellspacing="0" cellpadding="0"><tbody><tr><td style="font-size: 12px; -webkit-font-smoothing: subpixel-antialiased; text-size-adjust: 100%;" align="center" valign="top"><p style="line-height: 20.4px; text-size-adjust: 100%; font-family: 'Microsoft YaHei'!important; padding: 0px !important; margin: 0px !important; color: #7e8890 !important;"><span class="appleLinks"> Copyright © 2010-2021 SonderCloud Limited (Hong Kong). 保留所有权利。</span></p></td></tr><tr style="padding: 0px; margin: 0px; font-size: 0px; line-height: 0;"><td style="font-size: 12px; -webkit-font-smoothing: subpixel-antialiased; text-size-adjust: 100%;"> </td></tr><tr><td style="font-size: 12px; -webkit-font-smoothing: subpixel-antialiased; text-size-adjust: 100%;" align="center" valign="top"><p style="line-height: 20.4px; text-size-adjust: 100%; font-family: 'Microsoft YaHei'!important; padding: 0px !important; margin: 0px !important; color: #7e8890 !important;"><span class="appleLinks">邮件由系统自动发送，请勿直接回复本邮件！</span></p></td></tr></tbody></table></div></body></html>分享一个好看的邮件html模板相关推荐
- 【分享一个好看的Android item布局 使用于ListView，RecyleView JAVA版本（二）】
1.效果图: 2.思路与上文相同 此处略掉····· 3.布局层级:代码较长请耐心使用 // An highlighted block <?xml version="1.0" ...
- 分享一个简单好看的科技公司官网模板-纯HTML+CSS
分享一个简单好看的科技公司官网模板-纯HTML+CSS 首页: 首页的HTML源码部分: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...
- 分享一个微信小程序编辑页面的WXML模板
分享一个微信小程序编辑页面的WXML模板 最近在进行微信小程序开发的时候经常会碰到编辑页面的搭建,大致格式如图所示: 顶部:返回按钮和确认按钮,在中间还可以自行加上一些别的元素. 中间部分:编辑的标题 ...
- 分享一个运营商的华为OLT的通用模板
分享一个运营商的华为OLT的通用模板. 多业务模板,SFU,HGU通用. dba-profile add profile-id 21 profile-name "voip" typ ...
- 分享一个绿色的食品蔬菜水果外卖预订网站bootstrap模板
免费分享一个绿色的食品蔬菜水果外卖预订网站bootstrap模板,这个网站模板首页截图如下: OrganicFood是电子商务蔬菜水果外卖商城网站Bootstrap4模板,充分响应式HTML5模板.适 ...
- 分享一个简单好看的html的表格table（个人简历的html表格），vue table，以及vue打印（简单好用的vue打印插件）
想写一个很普通的那种像word文档样式的table,发现网上很多都是什么教程,没有合适的,我只想要一个拿来就能用的html的table(非专业前端),没有什么别的依赖,而且样式要很普通的简单的表格.既 ...
- 中文邮件营销html模版,怎么制作邮件营销模板？— —邮件格式
怎么制作邮件营销模板?- -邮件格式 U-Mail邮件营销平台 发表时间 2017-09-21 人气 757次 做EDM邮件营销,需要有好的邮件群发工具,还要有好的内容,那么如何制作好邮件营销的模板呢 ...
- 中文邮件格式模板、工作汇报邮件模板这样写，90%人都爱看
时常收发邮件的人都知道,邮件书写格式是一件很讲究的事,所以大家都要掌握基本的邮件格式模板. 如何书写一份得体的邮件? 原则:有礼貌.讲重点.条理清晰 称呼:通常根据职位来称呼,xx经理.xx总.xx老 ...
- MeterSphere消息通知之邮件自定义模板设置
Metersphere的消息通知支持自定义模板功能,我们公司使用邮件消息通知功能比较多些,Metersphere消息通知默认发送报告链接,报告内容太过于简单,接下来我给大家分享如何使用自定义模板去发送 ...
- 开课吧python学费-分享一个小白也能月赚2万的新技能
原标题:分享一个小白也能月赚2万的新技能 这两年,每天都听身边人吐槽:"最近太累了,加班多.事情杂.离家远......可到手的工资却少得可怜." 辞职.跳槽,已然成为一种常态. 这 ...
最新文章
- 简述nodejs、npm及其模块在windows下的安装与配置
- Go游戏服务器开发的一些思考（十）：goroutine和coroutine
- 647. Palindromic Substrings
- 线段树（结构体建法_QAQ）
- Git 企业开发者教程
- 编译原理中词法分析的递归下降分析法实例--能被5整除的二进制数---c语言实现
- 求最大公约数（辗转相除）
- Swift语言精要 - Dictionary(字典)
- leetcode 79.单词搜索 dfs
- 操作系统实验一：Linux基本操作
- 各省简称 拼音 缩写_中国省市县地区首字母缩写
- 小白C语言编程实战(16)：统计4门课的优秀率和不及格率
- 关闭Win10自动更新
- 抓住七月的尾巴，出门放松一下
- 微型计算机芯片上的位数,微处理器芯片的位数指的是什么
- matplotlib绘图教程
- C语言完成图书管理系统
- 多线程与 “锁”
- Golang源码中xmm0寄存器
- 一边「盆满钵满」，一边「卸磨杀驴」，这家龙头企业也整骚操作？