折腾-评论邮箱提示的邮件样式

December 22, 2019 · 技术 · 1974次阅读 · 共279字

前言

又到了星期天了,打开电脑
overwatch启动,尻什么**队友,overwatch关闭
qq启动,浏览器启动
访问友链,发现不得了的东西,打开qq邮箱,对比,giao
没错,就是这样,有了本文,如果没看明白那我也没办法了23333

其实事情的经过是这样的,我在逛森七的博客时发现了他美化的CommentToMail插件
样式挺好看的,于是我就稍微修改了一下他的样式,并吃上了
是真的好康!代码如下

guest.html

<div style="width: 550px;height: auto;border-radius: 5px;margin:0 auto;border:1px solid #ffb0b0;box-shadow: 0px 0px 20px #888888;position: relative;padding-bottom: 5px;">
    <div style="background-image: url(https://api.ixiaowai.cn/api/api.php);width:550px;height: 300px;background-size: cover;background-repeat: no-repeat;border-radius: 5px 5px 0px 0px;"></div>
    <div style="width: 200px;height: 40px;background-color: rgb(255, 114, 114);margin-top: -20px;margin-left: 20px;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);color: rgb(255, 255, 255);text-align: center;line-height: 40px;">Dear: {author_p}</div>
    <div style="background-color:white;line-height:180%;padding:0 15px 12px;width:520px;margin:30px auto;color:#555555;font-family:'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size:12px;margin-bottom: 0px;">  
        <h2 style="border-bottom:1px solid #DDD;font-size:14px;font-weight:normal;padding:13px 0 10px 8px;"><span style="color: #12ADDB;font-weight: bold;">&gt; </span>您在<a style="text-decoration:none;color: #12ADDB;" href="{permalink}" target="_blank">《{title}》</a>的评论有了新的回复呐~</h2>  
        <div style="padding:0 12px 0 12px;margin-top:18px">  
            <p>时间:<span style="border-bottom:1px dashed #ccc;" t="5" times=" 20:42">{time}</span></p>          
            <p>您的评论:</p>  
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0">{text_p}</p>  
            <p><strong>{author}</strong>&nbsp;给您的回复:</p>  
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0">{text}</p>  
        </div>  
    </div>

    <a style="text-decoration:none; color:#FFF;width: 40%;text-align: center;background-color:#ff7272;height: 40px;line-height: 35px;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.30);margin: -10px auto;display: block;" href="{permalink}" target="_blank">查看回复的完整內容</a>
    <div style="color:#8c8c8c;;font-family: 'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size: 10px;width: 100%;text-align: center;margin-top: 30px;">
        <p>本邮件为系统自动发送,请勿直接回复~</p>
    </div>
    <div style="color:#8c8c8c;;font-family: 'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size: 10px;width: 100%;text-align: center;">
        <p>©2019 Copyright 寒穹の小屋</p>
    </div>
</div>

owner.html

<div style="width: 550px;height: auto;border-radius: 5px;margin:0 auto;border:1px solid #ffb0b0;box-shadow: 0px 0px 20px #888888;position: relative;">
    <div style="background-image: url(https://api.ixiaowai.cn/api/api.php);width:550px;height: 250px;background-size: cover;background-repeat: no-repeat;border-radius: 5px 5px 0px 0px;"></div>
    <div style="background-color:white;line-height:180%;padding:0 15px 12px;width:520px;margin:10px auto;color:#555555;font-family:'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size:12px;margin-bottom: 0px;">
        <h2 style="border-bottom:1px solid #DDD;font-size:14px;font-weight:normal;padding:13px 0 10px 8px;"><span style="color: #12ADDB;font-weight: bold;">&gt; </span>您的文章<a style="text-decoration:none;color: #12ADDB;" href="{permalink}" target="_blank">《{title}》</a>有了新的回复耶~</h2>
        <div style="padding:0 12px 0 12px;margin-top:18px">
        <p>时间:<span style="border-bottom:1px dashed #ccc;" t="5" times=" 20:42">{time}</span></p> 
            <p><strong>{author}</strong>&nbsp;给您的评论:</p>
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0">{text}</p>
            <p>其他信息:</p>
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0">IP:{ip}<br />邮箱:<a href="mailto:{mail}">{mail}</a><br />状态:{status} [<a href='{manage}' target='_blank'>管理评论</a>]</p>
        </div>
    </div>
    <a style="text-decoration: none;color: rgb(255, 255, 255);width: 40%;text-align: center;background-color: rgb(255, 114, 114);height: 40px;line-height: 40px;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);display: block;margin: auto;" href="{permalink}" target="_blank">查看回复的完整內容</a>
    <div style="color:#8c8c8c;;font-family: 'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size: 10px;width: 100%;text-align: center;">
        <p>©2019 Copyright 寒穹の小屋</p>
    </div>
</div>

最后

这次就不放图啦(暗笑),其实你们评论一下就能看到啥样式了 /流汗滑稽

喝杯水

标签:mail,评论,title,文章,前言,寒穹,giao,回复,內容,author,copyright

最后编辑于:2020/01/19 23:23

添加新评论

  1. 2020-01-15 08:48

    嘤嘤嘤,不就多了张妹子图嘛

    回复
    1. 2020-01-15 08:49

      还是纸片人妹子

      回复
  2. 2020-01-10 08:11

    评论关了小半年了

    回复
  3. 2020-01-08 02:08

    康康

    回复
    1. 2020-01-08 13:10

      你康叭

      回复
  4. 2020-01-07 12:25

    看看长啥样

    回复
    1. 2020-01-07 20:14

      来啦来啦

      回复
  5. 2019-12-22 16:52

    让我康康

    回复
    1. 2019-12-22 17:00

      好嘞

      回复
  6. 2019-12-22 15:49

    回复
  7. 2019-12-22 15:16

    骗我评论是不是

    回复
    1. 2019-12-22 15:23

      没有啦

      回复
      1. 2019-12-22 15:38

        图片没显示,然后被拦到垃圾箱了,还有,和我的模板有点子太像了

        回复
  8. 2019-12-22 15:01

    看看长啥样

    回复
    1. 2019-12-22 15:23

      唔,康叭

      回复