jQuery每日秒杀商品倒计时

html & js：

	
倒计时
	
COUNT DOWN
	
	
距离结束还剩
	

		

		
00
		
00
		
00
	

  

css：

(zzsc.cs)

* {
    margin: 0;
    padding: 0;
}

.se-kl {
    width: 190px;
    height: 275px;
    background-color: #e83632;
    margin: 100px auto;
    position: relative;
}

.se-cn {
    position: absolute;
    top: 42px;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 34px;
    color: #fff;
}

.se-en {
    position: absolute;
    top: 90px;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 20px;
    color: rgba(255, 255, 255, 0.5);
}

.se-io {
    width: 20px;
    height: 33px;
    position: absolute;
    background: url(../imgs/seckill.png) no-repeat;
    background-position: -32.5px 0;
    background-size: 52.5px 40px;
    left: 85px;
    top: 126px;
    display: block;
}

.se-info {
    position: absolute;
    top: 170px;
    text-align: center;
    width: 100%;
    font-size: 16px;
    color: #fff;
}

.se-count {
    position: absolute;
    top: 212px;
    left: 30px;
    height: 40px;
}

.se-day {
    display: none;
}

.se-hour,
.se-min,
.se-sec {
    position: relative;
    background-color: #2f3430;
    width: 40px;
    height: 40px;
    float: left;
    text-align: center;
    line-height: 40px;
    margin-right: 5px;
}

.se-txt {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
}

.se-txt:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #e83632;
}

示例图1：

注：本程序依赖于jquery库，请自行下载并选择合适路径或使用远程cdn地址：https://cdn.bootcss.com/jquery/3.4.1/jquery.js