<style>
body{
background-color:black;
}
div{
// 设置钟的宽,高,
width:600px;
height:200px;
border-radius:50px; //圆角
box-shadow:0px 0px 20px 2px white inset; //内阴影
margin:100px auto; //左右居中
color:azure; //字体颜色
font-size:35px; //字体大小
line-height:200px; //文字居中
text-align:center;
}
</style>
<div id="box"></div>
<script>
var box = document.getElementById('box');
var str = '';
setInterval(function(){
//设置现在时间
var now = new Date();
var now_time = now.getTime();
// console.log(now_time);
//设置五一时间
var goal = new Date('2019-5-1 00:00:00');
var goal_time = goal.getTime();
// console.log(goal_time);
//时间差
// console.log(goal_time-now_time);
//转换
//天
// var a = parseInt((goal_time-now_time)/86400000);
var a = parseInt((goal_time-now_time)/1000/60/60/24);
// console.log(a);
//小时
var b = parseInt(((goal_time-now_time)/1000/60/60)%24);
// console.log(b);
//分钟
var c = parseInt(((goal_time-now_time)/1000/60)%60);
// console.log(c);
//秒
var d = parseInt(((goal_time-now_time)/1000)%60)
// console.log(d);
str = '距离五一还剩下'+zeroize(a)+'天'+zeroize(b)+'小时'+zeroize(c)+'分'+zeroize(d)+'秒';
box.innerHTML = str;
},1000)
function zeroize(num){
//可以用if...
//判断补‘0’
// if(num < 10){
// return '0'+num;
// }else{
// return num;
// }
//也可以用三元
// 三元 判断补‘0’
return num < 10 ? '0'+num:num;
}