前言

今天看到其他网站倒计时代码挺好看，就扒下来修改了下样式，效果图如下

<!--倒计时开始-->
<div class="gn_box">
    <h1>
        <font color=#E80017>2</font>
        <font color=#D1002E>0</font>
        <font color=#BA0045>1</font>
        <font color=#A3005C>9</font>
        <font color=#8C0073>年</font>
        <font color=#75008A>-</font>
        <font color=#5E00A1>新</font>
        <font color=#4700B8>年</font>
        <font color=#3000CF>倒</font>
        <font color=#1900E6>计</font>
        <font color=#0200FD>时</font>
    </h1>
    <center>
        <div id="CountMsg" class="HotDate"><span id="t_d">157 天</span> <span id="t_h">9 时</span> <span id="t_m">7
                分</span> <span id="t_s">42 秒</span></div>
    </center>
    <script type="text/javascript"> function getRTime() {
            var EndTime = new Date('2019/02/05 00:00:00');
            var NowTime = new Date();
            var t = EndTime.getTime() - NowTime.getTime();
            var d = Math.floor(t / 1000 / 60 / 60 / 24);
            var h = Math.floor(t / 1000 / 60 / 60 % 24);
            var m = Math.floor(t / 1000 / 60 % 60);
            var s = Math.floor(t / 1000 % 60);
            document.getElementById("t_d").innerHTML = d + " 天";
            document.getElementById("t_h").innerHTML = h + " 时";
            document.getElementById("t_m").innerHTML = m + " 分";
            document.getElementById("t_s").innerHTML = s + " 秒";
        }

        setInterval(getRTime, 1000);</script>
</div>
<!--倒计时结束-->

准备工作

进入handsome主题后台，控制台-->外观-->编辑当前外观，将下列代码粘贴到<div class="wrapper-md skt-loading" id="post-panel"> 之前,然后将样式代码丢到后台开发者设置，自定义css中，字体颜色以及大小自行修改

.gn_box {
    padding: 10px 14px;
    margin: 10px;
    margin-bottom: 20px;
    text-align: center;
    background-color: #fff;
}

#t_d {
    color: #982585;
    font-size: 18px;
}

#t_h {
    color: #8f79c1;
    font-size: 18px;
}

#t_m {
    color: #65b4b5;
    font-size: 18px;
}

#t_s {
    color: #83caa3;
    font-size: 18px;
}
Last modification：October 28, 2022
© Allow specification reprint
如果觉得我的文章对你有用，请随意赞赏