黄色简洁风格的网站即将上线倒计时页源码下载



11 40 14



模板描述:黄色简洁风格 网站即将上线 倒计时页,黄色简洁风格的网站即将上线倒计时页源码下载html模板下载

代码结构

1. 引入CSS

<link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="//fonts.googleapis.com/css?family=Philosopher:400,400i,700,700i" rel="stylesheet">
<link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="//fonts.googleapis.com/css?family=Philosopher:400,400i,700,700i" rel="stylesheet">

2. 引入JS

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/moment.js"></script>
<script type="text/javascript" src="js/moment-timezone-with-data.js"></script>
<script type="text/javascript" src="js/timer.js"></script>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/moment.js"></script>
<script type="text/javascript" src="js/moment-timezone-with-data.js"></script>
<script type="text/javascript" src="js/timer.js"></script>

3. HTML代码

<!--
author: xmoban.cn
Author URL: http://www.xmoban.cn
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html>
<head>
<title>simple coming soon Flat Responsive widget Template :: Xmoban.cn</title>
<!-- custom-theme -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Simple Coming soon Responsive web template, Bootstrap Web Templates, Flat Web Templates, " />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- //custom-theme -->
<link href="//fonts.googleapis.com/css?family=Philosopher:400,400i,700,700i" rel="stylesheet"></head>
<body class="bg-agileinfo">
   <h1 class="agile-head text-center">simple coming soon</h1>
	<div class="wrapper agileinfo">
		<div class="clock">
            <div class="column w3l days">
                <div class="timer w3" id="days"></div>
                <div class="aits text">DAYS</div>
            </div>
            <div class="timer w3ls days">:</div>
            <div class="column w3">
                <div class="timer w3layouts" id="hours"></div>
                <div class="agileits text">HOURS</div>
            </div>
            <div class="aits timer">:</div>
            <div class="column wthree">
                <div class="timer w3las" id="minutes"></div>
                <div class="text aits">MINUTES</div>
            </div>
            <div class="agile timer">:</div>
            <div class="column siteliga">
                <div class="timer stuoyal3w" id="seconds"></div>
                <div class="text wthree">SECONDS</div>
            </div>
        </div>
		    <div class="agileits_newsletter">
				<h2>Subscribe to our mailinglist or follow us on social media to stay up to date.</h2>
				<form action="#" method="post">
					<input type="email"  name="Email" placeholder="Enter your mail" required="">	
					<input type="submit" value="Subscribe">	
				</form>
				<ul class="agileinfo_social_icons w3l">
					<li><a href="#" class="w3_agileits_facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
					<li><a href="#" class="wthree_twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
					<li><a href="#" class="agileinfo_google"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
					<li><a href="#" class="agileits_pinterest"><i class="fa fa-pinterest-p" aria-hidden="true"></i></a></li>
					<li><a href="#" class="w3ls_rss"><i class="fa fa-rss" aria-hidden="true"></i></a></li>
				</ul>
			</div>
		</div>	
    <div class="agileits-w3layouts-copyright text-center">
		<p>© 2017 simple coming soon. All rights reserved | Design by <a href="//w3layouts.com/">xmoban.cn</a></p>
	</div>
	<!-- ad -->
<div class="container">
<!-- 自适应广告 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-1112982054462406"
     data-ad-slot="7771152246"
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<!-- /ad -->
	<!-- Custom-JavaScript-File-Links -->
    <!-- //Custom-JavaScript-File-Links -->
</body>
</html>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 分类 响应式 自适应 设备 风格 颜色 bootstrap bootstrap自适应 bootstrap响应式 pc+wap 移动+电脑 手机+电脑 简洁 简约 简单 黄色 宽屏 全屏 满屏 其他页 其他站

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到