基本信息
源码名称:HTML网页 倒计时(入门级)
源码大小:0.01M
文件格式:.rar
开发语言:CSS
更新时间:2020-08-20
友情提示:(无需注册或充值,赞助后即可获取资源下载链接)
嘿,亲!知识可是无价之宝呢,但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下,绝对物超所值哦!如有下载和支付问题,请联系我们QQ(微信同号):813200300
本次赞助数额为: 1 元×
微信扫码支付:1 元
×
请留下您的邮箱,我们将在2小时内将文件发到您的邮箱
源码介绍
倒计时
<!DOCTYPE html>
<html style="font-size: 85.3333px;">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="Cache-Control" content="no-transform">
<meta name="applicable-device" content="mobile">
<meta http-equiv="Cache-Control" content="no-siteapp">
<title>开学倒计时</title>
<style>
.timebox2{width:100%;height:400px;background-color:#FCF3E2;padding: 1rem 0;background: url(图片/背景图片.jpg) center center no-repeat;background-size: 100% 100%;}
.timebox2 div,timebox2 span,timebox2 div span{color: #333 !important;}
.timebox2 .timecounter span{color: #333 !important;}
.timetext{width: 100%;text-align: center;}
.timetexttitle{font-size:0.7rem;margin-bottom: 10px;color: #fff;}
.timetextintro{font-size: 0.4rem;margin-bottom: 10px;color: #fff;padding: 0 0.4rem;box-sizing: border-box;}
.timecounter{font-size: 0.5rem;}
.txt{padding: 0 0.2rem;box-sizing:border-box;}
.clearbg5{display: block;clear: both;width: 100%;height: 0.16rem;overflow: hidden;background-color: #eee;}
.txt p{line-height: 30px;margin-top: 0.2rem;}
.txt p img{width: 100%;}
.timecounter span{color: #fff;}
</style>
</head>
<body>
<div class="timebox2">
<div class="timetext">
<div class="timetexttitle">内容1</div>
<div class="timetextintro">内容2</div>
<div class="timetextintro">内容3</div>
<div class="timecounter">
<span id="t_d">0天</span>
<span id="t_h">0时</span>
<span id="t_m">0分</span>
<span id="t_s">0秒</span>
</div>
</div>
</div>
<script type="text/javascript">
function getRTime() {
var EndTime = new Date("2020/08/023 14:30: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>
</body>
</html>
倒计时
<!DOCTYPE html>
<html style="font-size: 85.3333px;">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="Cache-Control" content="no-transform">
<meta name="applicable-device" content="mobile">
<meta http-equiv="Cache-Control" content="no-siteapp">
<title>开学倒计时</title>
<style>
.timebox2{width:100%;height:400px;background-color:#FCF3E2;padding: 1rem 0;background: url(图片/背景图片.jpg) center center no-repeat;background-size: 100% 100%;}
.timebox2 div,timebox2 span,timebox2 div span{color: #333 !important;}
.timebox2 .timecounter span{color: #333 !important;}
.timetext{width: 100%;text-align: center;}
.timetexttitle{font-size:0.7rem;margin-bottom: 10px;color: #fff;}
.timetextintro{font-size: 0.4rem;margin-bottom: 10px;color: #fff;padding: 0 0.4rem;box-sizing: border-box;}
.timecounter{font-size: 0.5rem;}
.txt{padding: 0 0.2rem;box-sizing:border-box;}
.clearbg5{display: block;clear: both;width: 100%;height: 0.16rem;overflow: hidden;background-color: #eee;}
.txt p{line-height: 30px;margin-top: 0.2rem;}
.txt p img{width: 100%;}
.timecounter span{color: #fff;}
</style>
</head>
<body>
<div class="timebox2">
<div class="timetext">
<div class="timetexttitle">内容1</div>
<div class="timetextintro">内容2</div>
<div class="timetextintro">内容3</div>
<div class="timecounter">
<span id="t_d">0天</span>
<span id="t_h">0时</span>
<span id="t_m">0分</span>
<span id="t_s">0秒</span>
</div>
</div>
</div>
<script type="text/javascript">
function getRTime() {
var EndTime = new Date("2020/08/023 14:30: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>
</body>
</html>