• 注册
    • 查看作者
    • 博客底部footer设计

      说明:

      刚刚凭借自己仅有的css知识去改了以下单调的博客底部,现在已经好看多啦,效果如下

      博客底部footer设计

      1. 底部两行字是渐变色

      2. 心是会跳动的

      代码:

      接下来直接放代码了,喜欢的可以自己去修改一下,加更多的css特效

      十年之约的图指向的超链接打不开了,干脆改了一下。

          <!--以下为底部代码 -->
           <style>
           #footerTextIcon {
          display: inline-block;
          animation: beating 1s infinite;
          animation-timing-function: ease-out;
          margin: 0 3px;
      		 }
      	#timeDate {
      	animation: turn 6s infinite;
          animation-timing-function: ease-out;
      	}
      	#times{
      	    color: white;
      	    animation: turn 6s infinite;
              animation-timing-function: ease-out;
      	}
      	#hitokoto {
      	animation: turn 6s infinite;
          animation-timing-function: ease-out;
      	}
          @keyframes turn {
      0%{
          color: white;
          
      }
      25%{
          color: #66CCFF;
      }
      50%{
          color: #FF3366;
      }
      75% {
          color: red;
      }
      100% {
          color: white;
      }
          }
      @keyframes beating{
      0% {
          transform: scale(1);
      }
      20% {
          transform: scale(1.6);
      }
      30% {
          transform: scale(1);
      }
      50% {
          transform: scale(1.6);
      }
      70%, 100% {
          transform: scale(1);
      }
      }
          </style>
          
            <a href="填写你的站点url" target="_blank" rel="no follow noopener" style="color:orange">站点名称</a>
            <span id="footerTextIcon">❤️</span>
               <script src="https://v1.hitokoto.cn/?c=a&encode=js&select=%23hitokoto" defer></script>
            <p id="hitokoto"></p>
          <div>
        <span id="timeDate">载入天数...</span>
        <span id="times">载入时分秒...</span>
        <script style="font:whit">
        var now = new Date();
        function createtime(){
            var grt= new Date("10/10/2019 00:00:00");//此处修改你的建站时间或者网站上线时间
            now.setTime(now.getTime()+250);
            days = (now - grt ) / 1000 / 60 / 60 / 24;
            dnum = Math.floor(days);
            hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum);
            hnum = Math.floor(hours);
            if(String(hnum).length ==1 ){
                hnum = "0" + hnum;
            }
            minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum);
            mnum = Math.floor(minutes);
            if(String(mnum).length ==1 ){
                      mnum = "0" + mnum;
            }
            seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum);
            snum = Math.round(seconds);
            if(String(snum).length ==1 ){
                      snum = "0" + snum;
            }
            document.getElementById("timeDate").innerHTML = "本站安全运行&nbsp"+dnum+"&nbsp天";
            document.getElementById("times").innerHTML = hnum + "&nbsp小时&nbsp" + mnum + "&nbsp分&nbsp" + snum + "&nbsp秒";
        }
        setInterval("createtime()",250);
        </script>
        <br>
          <a href="https://www.wwcun.com" target="_blank" rel="nofollow">
      <img src="https://img.wwcun.com/user_files/1/bbs/65264176_1606403352.png" alt="Ten years" style="height: 1.5em; ">
      </a>

       [s-5] 感谢支持

      山西·朔州
    • 1
    • 3
    • 0
    • 104
    • 村长-Dream

      请登录之后再进行评论

      登录
    • 0
      Cat10神隐会员抽奖王
      花里胡哨的
    • 0
      Dream-小编8神隐会员十年之约
      6666
    • 0
      Dream-小编8神隐会员十年之约
      打赏了294金币
      • 财富排行榜
      • 等级排行榜
    • 十里清欢
      十里清欢
      一条有理想的咸鱼!
    • 小妖
      小妖
      普普通通的无名之辈
    • 依晨小哥
      依晨小哥
      自由干净
    • Cat
      Cat
      故梦待续 | 结局无期
    • Dream-认证官
      Dream-认证官
      他太懒了,什么都没有写
    • LuoJunJunJun
      LuoJunJunJun
      blog.jiangtian1217.cn
    • 乔治的小窝
      乔治的小窝
      他太懒了,什么都没有写
    • 猫狗鼠鱼
      猫狗鼠鱼
      ?博客:catdog007.icu ?b站up主:猫狗鼠鱼?
    • 村长-Dream
      村长-Dream
      一花一草一树木,一人一梦在追求。
    • Dream-活动官
      Dream-活动官
      他太懒了,什么都没有写
    • Cat
      Cat
      故梦待续 | 结局无期
    • 十里清欢
      十里清欢
      一条有理想的咸鱼!
    • 村长-Dream
      村长-Dream
      一花一草一树木,一人一梦在追求。
    • RJ
      RJ
      https://qrj.hk
    • 依晨小哥
      依晨小哥
      自由干净
    • Dream-认证官
    • 爱一世
      爱一世
      419598908
    • 小妖
      小妖
      普普通通的无名之辈
    • LuoJunJunJun
      LuoJunJunJun
      blog.jiangtian1217.cn
    • Dream-小编
    • 做任务
    • 实时动态
    • 偏好设置
    • 单栏布局 侧栏位置: