前往小程序,Get更优阅读体验!
立即前往
发布
社区首页 >专栏 >实现建站时间彩色字体

实现建站时间彩色字体

原创
作者头像
清软云团队
修改2021-03-12 10:48:13
修改2021-03-12 10:48:13
4630
举报
文章被收录于专栏:清软云团队清软云团队

<div class="container-fluid site-content"><div class="card"><div class="card-body text-center auth-nav" style="padding: 32px 0;border-top: 5px solid #00ff00;"> <div class="header-height-clone"></div> <main class="container mb-auto mt-auto"> <div class="carousel carousel-main"> <div class="carousel-cell"> <h3 class="mt-3 main-header-text-title"><span> <div class="row"> <div class="col-lg-12"> <div class="card"> <div class="card-header"> <h4>本站已安全运行</h4> </div> </div> </div> </div> <span id="momk"></span> <script language=javascript> function show_date_time(){ window.setTimeout("show_date_time()", 1000); BirthDay=new Date("02-12 10:10 2021");//建站日期 today=new Date(); timeold=(today.getTime()-BirthDay.getTime()); sectimeold=timeold/1000 secondsold=Math.floor(sectimeold); msPerDay=24*60*60*1000 e_daysold=timeold/msPerDay daysold=Math.floor(e_daysold); e_hrsold=(daysold-e_daysold)*-24; hrsold=Math.floor(e_hrsold); e_minsold=(hrsold-e_hrsold)*-60; minsold=Math.floor((hrsold-e_hrsold)*-60); seconds=Math.floor((minsold-e_minsold)*-60); momk.innerHTML=daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒" ; } show_date_time(); </script> <style> #momk{animation:change 10s infinite;font-weight:800; } @keyframes change{0%{color:#5cb85c;}25%{color:#556bd8;}50%{color:#e40707;}75%{color:#66e616;}100% {color:#67bd31;}} </style></span> <div class="font-s12 push-20 clearfix"> <hr class="remove-margin-t"> <div style='text-align:center; padding:0px 0px 5px 0px;'>

</div> </div> </div> </div>

将以上代码加入进来,更改“//建站日期”标签前括号里内容为准确建站时间即可。

实现图

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档