一款js简单的倒计时自定义日期时间倒计时代码。
使用方法
引入需要用到的CSS样式
html { display: grid; min-height: 100%; } body { display: grid; background: #183059; } .container { position: relative; margin: auto; overflow: hidden; width: 650px; height: 180px; } h1 { font-family: "Lato", sans-serif; text-align: center; margin-top: 2em; font-size: 1em; text-transform: uppercase; letter-spacing: 5px; color: #F6F4F3; } #timer { color: #F6F4F3; text-align: center; text-transform: uppercase; font-family: "Lato", sans-serif; font-size: .7em; letter-spacing: 5px; } .days, .hours, .minutes, .seconds { display: inline-block; padding: 20px; width: 100px; border-radius: 5px; } .days { background: #EF2F3C; } .hours { background: #F6F4F3; color: #183059; } .minutes { background: #276FBF; } .seconds { background: #F0A202; } .numbers { font-family: "Montserrat", sans-serif; color: #183059; font-size: 5em; } footer { position: absolute; bottom: 0; right: 0; text-transform: uppercase; padding: 10px; font-family: "Lato", sans-serif; font-size: 0.7em; } footer p { letter-spacing: 3px; color: #EF2F3C; } footer a { color: #F6F4F3; text-decoration: none; } footer a:hover { color: #276FBF; }