jquery实现卡片翻牌倒计时代码
代码语言:html
所属分类:其他
代码描述:jquery实现卡片翻牌倒计时代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" /> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script> <style> charset "utf-8"; body { background-color: #f2f1ed; } .wrap { position: absolute; bottom: 0; top: 0; left: 0; right: 0; margin: auto; height: 310px; } a { text-decoration: none; color: #1a1a1a; } h1 { margin-bottom: 60px; text-align: center; font: 300 2.25em "Lato"; text-transform: uppercase; } h1 strong { font-weight: 400; color: #ea4c4c; } h2 { margin-bottom: 80px; text-align: center; font: 300 0.7em "Lato"; text-transform: uppercase; } h2 strong { font-weight: 400; } .countdown { width: 720px; margin: 0 auto; } .countdown .bloc-time { float: left; margin-right: 45px; text-align: center; } .countdown .bloc-time:last-child { margin-right: 0; } .countdown .count-title { display: block; margin-bottom: 15px; font: normal 1.24em "Lato"; color: #1a1a1a; text-transform: uppercase; } .countdown .figure { position: relative; float: left; height: 110px; width: 100px; margin-right: 10px; background-color: #fff; border-radius: 8px; -moz-box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2), inset 2px 4px 0 0 rgba(255, 255, 255, 0.08); -webkit-box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2), inset 2px 4px 0 0 rgba(255, 255, 255, 0.08); box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2), inset 2px 4px 0 0 rgba(255, 255, 255, 0.08); } .countdown .figure:last-child { margin-right: 0; } .........完整代码请登录后点击上方下载按钮下载查看
网友评论0