<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.section h3 {
font-size: 2.5rem;
font-weight: 400;
}
.time-content span {
background: url(http://www.ulefone.com/images/promotion/blackfriday2016/hei5-time.jpg) center center no-repeat!important;
background-size: cover;
display: inline-block;
text-align: center;
color: #fff;
51px;
height: 31px;
padding: 14px 0;
margin: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-style: normal;
font-size: 1.5rem;
}
</style>
<script>
function timer()
{
var ts = (new Date(2016, 11, 17, 8, 0, 0)) - (new Date());//计算剩余的毫秒数
// console.log(ts);
if (ts <= 0) {
return;
}else{
var dd = parseInt(ts / 1000 / 60 / 60 / 24, 10);//计算剩余的天数
var hh = parseInt(ts / 1000 / 60 / 60 % 24, 10);//计算剩余的小时数
var mm = parseInt(ts / 1000 / 60 % 60, 10);//计算剩余的分钟数
var ss = parseInt(ts / 1000 % 60, 10);//计算剩余的秒数
document.getElementById("d").innerHTML = dd + "d";
document.getElementById("h").innerHTML = hh + "h";
document.getElementById("m").innerHTML = mm + "m";
document.getElementById("s").innerHTML = ss + "s";
}}
var int=setInterval(timer,1000);
</script>
</head>
<body>
<div class="time" style="">
<div id="timer" style="display: inline;"> </div>
<h3 class="p6000-time time-content" style="display: inline; font-size: 1.5rem;">Remaining:
<span id="d"><i></i></span>
<span id="h"><i></i></span>
<span id="m"><i></i></span>
<span id="s"><i></i></span>
</h3>
</div>
</body>
</html>