黑色簡潔風格的商務企業網站源碼下載



6 21 8



模板描述:黑色簡潔風格 商務 企業網站,黑色簡潔風格的商務企業網站源碼下載html模板下載

代碼結構

1. 引入CSS

<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/owl.carousel.css" rel="stylesheet">
<link rel="stylesheet" href="css/team.css" type="text/css" media="all" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="//fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800" rel="stylesheet">
<link rel="stylesheet " href="css/chocolat.css " type="text/css" media="all" />

2. 引入JS

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.countup.js"></script>
<script src="js/responsiveslides.min.js"></script>
<script src="js/simplePlayer.js"></script>
<script src="js/modernizr-2.6.2.min.js"></script>
<script src="js/jquery.chocolat.js "></script>
<script src="js/owl.carousel.js"></script>
<script type="text/javascript" src="js/bootstrap-3.1.1.min.js"></script>

3. HTML代碼

	<!-- banner -->
	<div class="main_section_agile" id="home">
		<div class="agileits_w3layouts_banner_nav">
			<nav class="navbar navbar-default">
				<div class="navbar-header navbar-left">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<h1><a class="navbar-brand" href="index.html"> <span>D</span>eft</a></h1>
				</div>
				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">
					<nav class="menu-hover-effect menu-hover-effect-4">
						<ul class="nav navbar-nav">
							<li class="active"><a href="index.html" class="hvr-ripple-in"> Home</a></li>
							<li><a href="about.html" class="hvr-ripple-in">About</a></li>
							<li><a href="services.html" class="hvr-ripple-in">Services</a></li>
							<li><a href="blog.html" class="hvr-ripple-in">Blog</a></li>
							<li class="dropdown">
								<a href="#" class="dropdown-toggle hvr-ripple-in" data-toggle="dropdown">Short Codes <b class="fa fa-caret-down" aria-hidden="true"></b></a>
								<ul class="dropdown-menu agile_short_dropdown">
									<li><a href="icons.html">Web Icons</a></li>
									<li><a href="typography.html">Typography</a></li>
								</ul>
							</li>
							<li><a href="mail.html" class="hvr-ripple-in">Mail Us</a></li>
						</ul>
					</nav>
				</div>
			</nav>
			<div class="clearfix"> </div>
		</div>
	</div>
<div class="banner_top">
			<div class="slider">
				<div class="wrapper">
					<div class="agile_banner_text_info">
						<h3 class="editContent"> <span class="editContent">Expert in </span> Business <label class="editContent">Advice</label> </h3>
					</div>
					<!-- Slideshow 3 -->
					<ul class="rslides" id="slider">
						<li><img src="images/banner1.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner2.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner3.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner4.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner5.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner6.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner1.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner2.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner3.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner4.jpg" data-selector="img" alt=""></li>
						<li><img src="images/banner5.jpg" data-selector="img" alt=""></li>
					</ul>
					<!-- Slideshow 3 Pager -->
					<ul id="slider3-pager">
						<li><a href="#"><img src="images/banner11.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner22.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner33.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner44.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner55.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner66.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner11.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner22.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner33.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner44.jpg" data-selector="img" alt=""></a></li>
						<li><a href="#"><img src="images/banner55.jpg" data-selector="img" alt=""></a></li>
					</ul>
				</div>
			</div>
		</div>
		<!-- //banner -->
	<!-- //banner -->
	<!-- banner-bottom -->
	<div class="banner-bottom">
		<div class="container">
			<div class="col-md-4 agileits_banner_bottom_left">
				<div class="agileinfo_banner_bottom_pos">
					<div class="w3_agileits_banner_bottom_pos_grid">
						<div class="col-xs-3 wthree_banner_bottom_grid_left">
							<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
								<i class="fa fa-laptop" aria-hidden="true"></i>
							</div>
						</div>
						<div class="col-xs-9 wthree_banner_bottom_grid_right">
							<h4>Clean and Modern</h4>
							<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
							<div class="agileits-button two">
								<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
							</div>
						</div>
						<div class="clearfix"> </div>
					</div>
				</div>
			</div>
			<div class="col-md-4 agileits_banner_bottom_left">
				<div class="agileinfo_banner_bottom_pos">
					<div class="w3_agileits_banner_bottom_pos_grid">
						<div class="col-xs-3 wthree_banner_bottom_grid_left">
							<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
								<i class="fa fa-pencil" aria-hidden="true"></i>
							</div>
						</div>
						<div class="col-xs-9 wthree_banner_bottom_grid_right">
							<h4>Unique Design</h4>
							<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
							<div class="agileits-button two">
								<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
							</div>
						</div>
						<div class="clearfix"> </div>
					</div>
				</div>
			</div>
			<div class="col-md-4 agileits_banner_bottom_left">
				<div class="agileinfo_banner_bottom_pos">
					<div class="w3_agileits_banner_bottom_pos_grid">
						<div class="col-xs-3 wthree_banner_bottom_grid_left">
							<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
								<i class="fa fa-mobile" aria-hidden="true"></i>
							</div>
						</div>
						<div class="col-xs-9 wthree_banner_bottom_grid_right">
							<h4>Fully Responsive</h4>
							<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
							<div class="agileits-button two">
								<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
							</div>
						</div>
						<div class="clearfix"> </div>
					</div>
				</div>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
	<!-- //banner-bottom -->
	<!-- /about -->
	<div class="about" id="welcome">
		<div class="container">
			<div class="wthree_head_section">
				<h3 class="w3l_header w3_agileits_header two">Welcome <span>to our Deft</span></h3>
			</div>
			<div class="agile_wthree_inner_grids">
				<div class="col-md-6 about_agileinfo">
					<h4>Start Something New</h4>
					<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard
						dummy text ever since the 1500s but also the leap into electronic typesetting dolor amet.</p>
					<p>Integer laoreet ultricies nunc, vitae eleifend elit rutrum sit amet. In elementum, magna id pellentesque auctor, risus
						dolor congue urna, nec dapibus eros magna a odio. Duis laoreet risus eget malesuada consequat. Nunc et tortor dignissim,
						laoreet est eget</p>
					<div class="agileits-button two service">
						<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
					</div>
				</div>
				<div class="col-md-6 about_agileinfo_grid_imgs">
					<img src="images/banner1.jpg" alt="" />
					<img src="images/banner6.jpg" alt="" />
				</div>
				<div class="clearfix"></div>
			</div>
		</div>
	</div>
	<!-- Modal4 -->
	<div class="modal fade" id="myModal4" tabindex="-1" role="dialog">
		<div class="modal-dialog">
			<!-- Modal content-->
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
					<div class="modal-info">
						<h4>Deft</h4>
						<img src="images/banner2.jpg" alt=" " class="img-responsive" />
						<h5>Sub Heading here</h5>
						<p class="para-agileits-w3layouts">Duis sit amet nisi quis leo fermentum vestibulum vitae eget augue. Nulla quam nunc, vulputate id urna at, tempor tincidunt
							metus. Sed feugiat quam nec mauris mattis malesuada.</p>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- //Modal4 -->
	<!--//about -->
	<!-- stats -->
	<div class="stats" id="stats">
		<div class="container">
			<div class="col-md-3 w3layouts_stats_left w3_counter_grid">
				<i class="fa fa-smile-o" aria-hidden="true"></i>
				<p class="counter">45</p>
				<h3>Happy Clients</h3>
			</div>
			<div class="col-md-3 w3layouts_stats_left w3_counter_grid1">
				<i class="fa fa-instagram" aria-hidden="true"></i>
				<p class="counter">165</p>
				<h3>Instagram</h3>
			</div>
			<div class="col-md-3 w3layouts_stats_left w3_counter_grid2">
				<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
				<p class="counter">563</p>
				<h3>Completed Work </h3>
			</div>
			<div class="col-md-3 w3layouts_stats_left w3_counter_grid3">
				<i class="fa fa-trophy" aria-hidden="true"></i>
				<p class="counter">245</p>
				<h3>Awards Won </h3>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
	<!-- //stats -->
	<!--skills -->
	<div class="skills-agileinfo" id="skills">
		<div class="col-md-6 skills">
		</div>
		<div class="col-md-6 bar-grids  w3-agile">
			<div class="wthree_head_section">
				<h3 class="w3l_header w3_agileits_header">Our <span>Skills</span></h3>
			</div>
			<div class="wthree_skills">
				<h6>Editing<span> 95% </span></h6>
				<div class="progress">
					<div class="progress-bar progress-bar-striped active" style="width: 95%">
					</div>
				</div>
				<h6>Marketing<span> 85% </span></h6>
				<div class="progress">
					<div class="progress-bar progress-bar-striped active" style="width: 85%">
					</div>
				</div>
				<h6>Creativity<span>90% </span></h6>
				<div class="progress">
					<div class="progress-bar progress-bar-striped active" style="width: 90%">
					</div>
				</div>
				<h6>Professional<span>86% </span></h6>
				<div class="progress prgs-w3agile-last">
					<div class="progress-bar progress-bar-striped active" style="width: 86%">
					</div>
				</div>
			</div>
		</div>
		<div class="clearfix"> </div>
	</div>
	<!-- //skills -->
	<!-- services -->
	<div class="services" id="services">
		<div class="container">
			<div class="wthree_head_section">
				<h3 class="w3l_header w3_agileits_header two">Our <span>Services</span></h3>
			</div>
			<div class="agile_wthree_inner_grids">
				<div class="col-md-4 agileits_banner_bottom_left">
					<div class="agileinfo_banner_bottom_pos">
						<div class="w3_agileits_banner_bottom_pos_grid">
							<div class="col-xs-3 wthree_banner_bottom_grid_left">
								<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
									<i class="fa fa-map-o" aria-hidden="true"></i>
								</div>
							</div>
							<div class="col-xs-9 wthree_banner_bottom_grid_right">
								<h4 class="sub_service_agileits">Bootstrap Menu</h4>
								<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
								<div class="agileits-button two service">
									<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="col-md-4 agileits_banner_bottom_left">
					<div class="agileinfo_banner_bottom_pos">
						<div class="w3_agileits_banner_bottom_pos_grid">
							<div class="col-xs-3 wthree_banner_bottom_grid_left">
								<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
									<i class="fa fa-rocket" aria-hidden="true"></i>
								</div>
							</div>
							<div class="col-xs-9 wthree_banner_bottom_grid_right">
								<h4 class="sub_service_agileits">Responsive Design</h4>
								<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
								<div class="agileits-button two service">
									<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="col-md-4 agileits_banner_bottom_left">
					<div class="agileinfo_banner_bottom_pos">
						<div class="w3_agileits_banner_bottom_pos_grid">
							<div class="col-xs-3 wthree_banner_bottom_grid_left">
								<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
									<i class="fa fa-paint-brush" aria-hidden="true"></i>
								</div>
							</div>
							<div class="col-xs-9 wthree_banner_bottom_grid_right">
								<h4 class="sub_service_agileits">Graphic Design</h4>
								<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
								<div class="agileits-button two service">
									<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="col-md-4 agileits_banner_bottom_left two">
					<div class="agileinfo_banner_bottom_pos">
						<div class="w3_agileits_banner_bottom_pos_grid">
							<div class="col-xs-3 wthree_banner_bottom_grid_left">
								<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
									<i class="fa fa-pencil" aria-hidden="true"></i>
								</div>
							</div>
							<div class="col-xs-9 wthree_banner_bottom_grid_right">
								<h4 class="sub_service_agileits">Google Web Fonts</h4>
								<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
								<div class="agileits-button two service">
									<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="col-md-4 agileits_banner_bottom_left  two">
					<div class="agileinfo_banner_bottom_pos">
						<div class="w3_agileits_banner_bottom_pos_grid">
							<div class="col-xs-3 wthree_banner_bottom_grid_left">
								<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
									<i class="fa fa-fire" aria-hidden="true"></i>
								</div>
							</div>
							<div class="col-xs-9 wthree_banner_bottom_grid_right">
								<h4 class="sub_service_agileits">Branding</h4>
								<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
								<div class="agileits-button two service">
									<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="col-md-4 agileits_banner_bottom_left  two">
					<div class="agileinfo_banner_bottom_pos">
						<div class="w3_agileits_banner_bottom_pos_grid">
							<div class="col-xs-3 wthree_banner_bottom_grid_left">
								<div class="agile_banner_bottom_grid_left_grid hvr-radial-out">
									<i class="fa fa-video-camera" aria-hidden="true"></i>
								</div>
							</div>
							<div class="col-xs-9 wthree_banner_bottom_grid_right">
								<h4 class="sub_service_agileits">Video Design</h4>
								<p>Morbi viverra lacus commodo felis semper, eu iaculis lectus feugiat.</p>
								<div class="agileits-button two service">
									<a class="btn btn-primary btn-lg hvr-underline-from-left" href="single.html" role="button">Read More ?</a>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
	<!-- //services -->
	<!-- //services -->
	<div class="portfolio-agileinfo" id="portfolio">
		<div class="container">
			<div class="wthree_head_section">
				<h3 class="w3l_header w3_agileits_header">Our <span>Portfolio</span></h3>
			</div>
		</div>
		<div class="agile_wthree_inner_grids">
			<div class="agile_port_w3ls_info">
				<div class="portfolio-grids_main">
					<div class="col-md-6 portfolio-grids" data-aos="zoom-in">
						<a href="images/g1.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
								<img src="images/g1.jpg" class="img-responsive" alt="w3ls" />
								<div class="b-wrapper two">
									<i class="fa fa-magic" aria-hidden="true"></i>
								</div>
							</a>
					</div>
					<div class="col-md-6 portfolio-grid_left">
						<div class="col-md-6 portfolio-grids" data-aos="zoom-in">
							<a href="images/g5.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
									<img src="images/g5.jpg" class="img-responsive" alt="w3ls" />
									<div class="b-wrapper">
									<i class="fa fa-magic" aria-hidden="true"></i>
									</div>
								</a>
						</div>
						<div class="col-md-6 portfolio-grids" data-aos="zoom-in">
							<a href="images/g4.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
									<img src="images/g4.jpg" class="img-responsive" alt="w3ls" />
									<div class="b-wrapper">
										<i class="fa fa-magic" aria-hidden="true"></i>
									</div>
								</a>
						</div>
					</div>
					<div class="clearfix"> </div>
				</div>
				<div class="portfolio-grids_main">
					<div class="col-md-6 portfolio-grid_left">
						<div class="col-md-6 portfolio-grids" data-aos="zoom-in">
							<a href="images/g6.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
									<img src="images/g6.jpg" class="img-responsive" alt="w3ls" />
									<div class="b-wrapper">
									<i class="fa fa-magic" aria-hidden="true"></i>
									</div>
								</a>
						</div>
						<div class="col-md-6 portfolio-grids" data-aos="zoom-in">
							<a href="images/g3.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
									<img src="images/g3.jpg" class="img-responsive" alt="w3ls" />
									<div class="b-wrapper">
										<i class="fa fa-magic" aria-hidden="true"></i>
									</div>
								</a>
						</div>
					</div>
					<div class="col-md-6 portfolio-grids" data-aos="zoom-in">
						<a href="images/g2.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
								<img src="images/g2.jpg" class="img-responsive" alt="w3ls" />
								<div class="b-wrapper two">
									<i class="fa fa-magic" aria-hidden="true"></i>
								</div>
							</a>
					</div>
					<div class="clearfix"> </div>
				</div>
			</div>
		</div>
	</div>
	<!--// Gallery -->
	<!-- 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 -->
	<!-- agile_testimonials -->
	<div class="agile_testimonials" id="testimonials">
		<div class="container">
			<div class="wthree_head_section">
				<h3 class="w3l_header w3_agileits_header">Our <span>testimonials</span></h3>
			</div>
			<div class="agile_wthree_inner_grids">
				<div class="test-agile_main_section">
					<div id="owl-demo2" class="owl-carousel">
						<div class="agile">
							<div class="test-grid">
								<i class="fa fa-quote-left" aria-hidden="true"></i>
								<p class="para-w3-agile">Lorem ipsum dolor sit amet, consectetur adipiscing elit,consectetur adipiscing elit, sed do eiusmod tempor incididunt
									ut labore et dolore magna aliqua sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
									veniam, quis. Lorem ipsum dolor .</p>
								<div class="test-grid1">
									<div class="test-grid2">
										<img src="images/1.png" alt="" class="img-r">
									</div>
									<div class="test-grid2_text">
										<h4>John Warner</h4>
										<span>Client</span>
									</div>
									<div class="clearfix"></div>
								</div>
							</div>
						</div>
						<div class="agile">
							<div class="test-grid">
								<i class="fa fa-quote-left" aria-hidden="true"></i>
								<p class="para-w3-agile">Lorem ipsum dolor sit amet, consectetur adipiscing elit,consectetur adipiscing elit, sed do eiusmod tempor incididunt
									ut labore et dolore magna aliqua sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
									veniam, quis. Lorem ipsum dolor .</p>
								<div class="test-grid1">
									<div class="test-grid2">
										<img src="images/2.png" alt="" class="img-r">
									</div>
									<div class="test-grid2_text">
										<h4>Steve Warner</h4>
										<span>Client</span>
									</div>
									<div class="clearfix"></div>
								</div>
							</div>
						</div>
						<div class="agile">
							<div class="test-grid">
								<i class="fa fa-quote-left" aria-hidden="true"></i>
								<p class="para-w3-agile">Lorem ipsum dolor sit amet, consectetur adipiscing elit,consectetur adipiscing elit, sed do eiusmod tempor incididunt
									ut labore et dolore magna aliqua sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
									veniam, quis. Lorem ipsum dolor .</p>
								<div class="test-grid1">
									<div class="test-grid2">
										<img src="images/3.png" alt="" class="img-r">
									</div>
									<div class="test-grid2_text">
										<h4>James Warner</h4>
										<span>Client</span>
									</div>
									<div class="clearfix"></div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- //agile_testimonials -->
	<div class="agile_w3_video">
		<div class="video-grid-single-page-agileits">
			<div data-video="zCyB2DQFdA0" id="video"> <img src="images/video.jpg" alt="" class="img-responsive" /> </div>
		</div>
	</div>
	<!-- /map -->
	<div class="map">
		<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d387142.84010033106!2d-74.25819252532891!3d40.70583163828471!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew+York%2C+NY%2C+USA!5e0!3m2!1sen!2sin!4v1475140387172"
		    style="border:0"></iframe>
	</div>
	<!-- //map -->
	<!-- footer -->
	<div class="footer">
		<div class="f-bg-w3l">
			<div class="container">
				<div class="col-md-4 w3layouts_footer_grid">
					<h2>Follow <span>Us</span></h2>
					<ul class="social_agileinfo">
						<li><a href="#" class="w3_facebook"><i class="fa fa-facebook"></i></a></li>
						<li><a href="#" class="w3_twitter"><i class="fa fa-twitter"></i></a></li>
						<li><a href="#" class="w3_instagram"><i class="fa fa-instagram"></i></a></li>
						<li><a href="#" class="w3_google"><i class="fa fa-google-plus"></i></a></li>
					</ul>
				</div>
				<div class="col-md-8 w3layouts_footer_grid">
					<form action="#" method="post">
						<input type="email" name="Email" placeholder="Enter your email..." required="">
						<button class="btn1"><i class="fa fa-envelope-o" aria-hidden="true"></i></button>
						<div class="clearfix"> </div>
					</form>
					<ul class="w3l_footer_nav">
						<li><a href="index.html" class="active">Home</a></li>
						<li><a href="services.html">Services</a></li>
						<li><a href="gallery.html">Gallery</a></li>
						<li><a href="icons.html">Web Icons</a></li>
						<li><a href="mail.html">Mail Us</a></li>
					</ul>
					<p>? 2017 Deft. All Rights Reserved | Design by <a href="http://www.cqetom.live//" target="_blank">xmoban.cn</a></p>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
	<!-- //footer -->
	<!-- js -->
	<!-- //js -->
	<!-- stats -->
	<script>
		$('.counter').countUp();
	</script>
	<!-- //stats -->
	<!-- Slider script -->
		<script>
			// You can also use "$(window).load(function() {"
			$(function () {
				$("#slider").responsiveSlides({
					auto: true,
					nav: true,
					manualControls: '#slider3-pager',
				});
			});
		</script>
	<!-- /nav -->
	<script>
		$("document").ready(function () {
			$("#video").simplePlayer();
		});
	</script>
	<!-- //nav -->
	<!-- js for portfolio lightbox -->
	<!--light-box-files -->
	<script type="text/javascript ">
		$(function () {
			$('.portfolio-grids a').Chocolat();
		});
	</script>
	<!-- /js for portfolio lightbox -->
	<!-- requried-jsfiles-for owl -->
	<script>
		$(document).ready(function () {
			$("#owl-demo2").owlCarousel({
				items: 1,
				lazyLoad: false,
				autoPlay: true,
				navigation: false,
				navigationText: false,
				pagination: true,
			});
		});
	</script>
	<!-- //requried-jsfiles-for owl -->



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 行業 企業 公司 工廠 分類 響應式 自適應 設備 風格 顏色 扁平化 企業 行業 公司 工廠 黑色 bootstrap bootstrap自適應 bootstrap響應式 pc+wap 移動+電腦 手機+電腦 簡潔 簡約 簡單 商務 商務公司
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子