白色欧美风格的时尚服饰设计企业网站源码下载



4 14 5



模板描述:白色欧美风格 时尚服饰设计 企业网站,白色欧美风格的时尚服饰设计企业网站源码下载html模板下载

代码结构

1. 引入CSS

<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="all" />
<link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="css/simpleLightbox.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="css/text-style.css">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="//fonts.googleapis.com/css?family=Ubuntu:300,400,500,700" rel="stylesheet">
<link href="//fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700" rel="stylesheet">

2. 引入JS

<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script src="js/modernizr.js"></script>
<script src="js/main.js"></script>
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.countup.js"></script>
<script src="js/simpleLightbox.js"></script>
<script src="js/SmoothScroll.min.js"></script>
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<script type="text/javascript" src="js/bootstrap-3.1.1.min.js"></script>

3. HTML代码

<!--banner start here-->
<div class="banner" id="home">
   <div class="header">
		   <div class="header-main">
		   	 <div class="container">
			<nav class="navbar navbar-default">
					<div class="navbar-header">
						<button type="button" class="navbar-toggle" 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  href="index.html">Sewing<span>Great look in Outfit</span></a></h1>
					</div>
					<!-- navbar-header -->
					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav navbar-right">
								<li class="scroll hvr-outline-in"><a href="index.html">Home</a></li>
								<li><a class="scroll hvr-outline-in" href="#about">About</a></li>
								<li class="dropdown menu__item">
									<a href="#" class="dropdown-toggle menu__link hvr-outline-in"  data-toggle="dropdown" data-hover="Pages" role="button" aria-haspopup="true" aria-expanded="false">Dropdown<span class="caret"></span></a>
									<ul class="dropdown-menu">
										<li><a href="#works" class="scroll">Latest works</a></li>
										<li><a href="#services" class="scroll">Services</a></li>
										<li><a href="#experts" class="scroll">Experts</a></li>
									</ul>
								</li>
								<li><a class="scroll hvr-outline-in" href="#gallery">Gallery</a></li>
								<li><a class="scroll hvr-outline-in" href="#contact">Contact</a></li>
						  </ul>
					</div>
					<div class="clearfix"> </div>	
				</nav>
			 <div class="clearfix"> </div>
		   </div>
		   </div>
<div class="container">
		   <div class="banner-text">
		   	  <section class="cd-intro">
		<h2 class="cd-headline letters scale">
			<span>clothes that need to be</span> 
			<span class="cd-words-wrapper">
				<b class="is-visible">Sewing</b>
				<b>mending</b>
				<b>applique</b>
				<b>alteration</b>
			</span>
		</h2>
	</section> 
		<div class="botton-agileits">
			<a href="#" class="hvr-rectangle-in" data-toggle="modal" data-target="#myModal1" >know more</a>
		</div>
			<div class="agileits_w3layouts_call_mail">
					<ul>
						<li><i class="fa fa-phone" aria-hidden="true"></i>(+000) 123 456 78</li>
						<li><i class="fa fa-envelope-o" aria-hidden="true"></i><a href="mailto:maria@example.com">info@example.com</a></li>
					</ul>
			</div>
			<div class="banner-icons-agileinfo">
				<ul class="agileits_social_list">
					<li><a href="#" class="w3_agile_facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
					<li><a href="#" class="agile_twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
					<li><a href="#" class="w3_agile_dribble"><i class="fa fa-dribbble" aria-hidden="true"></i></a></li>
				</ul>
			</div>
		</div>  
		</div>
	</div>
</div>
<!--banner end here-->
						<!-- Modal1 -->
						<div class="modal fade" id="myModal1" 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>
										<h4>Sewing</h4>
										<img src="images/a1.jpg" alt=" " class="img-responsive">
										<h3 class="subheading-w3l">Welcome to <span>Sewing</span> Designs</h3>
										<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, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.</p>
									</div>
								</div>
							</div>
						</div>
						<!-- //Modal1 -->
<!-- banner-bottom -->
	<div id="about" class="banner-bottom">
		<div class="container">
		<div class="tittle-agileinfo">
				<h3>About Us</h3>
			</div>
			<div class="w3ls_banner_bottom_grid1">
				<div class="col-md-6 w3l_banner_bottom_left">	
					<img src="images/a1.jpg" alt=" " class="img-responsive" />
				</div>
				<div class="col-md-6 w3l_banner_bottom_right">
					<h3 class="subheading-w3l">Welcome to <span>Sewing</span> Designs</h3>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vel gravida tortor, molestie venenatis mauris.<br> Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec at vestibulum nunc.</p>
				<ul>
					<li><i class="fa fa-clone" aria-hidden="true"></i>Designing</li>
					<li><i class="fa fa-clone" aria-hidden="true"></i>Alteration</li>
					<li><i class="fa fa-clone" aria-hidden="true"></i>Mending</li>
					<li><i class="fa fa-clone" aria-hidden="true"></i>applique</li>
				</ul>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
<!-- //banner-bottom -->
<!--latest-works-->
<div class="latest-works" id="works">
<div class="container">
		<div class="tittle-agileinfo">
				<h3 class="white-w3ls">Latest Works</h3>
			</div>
			<div class="col-md-8 agileits_banner_bottom_grid_three">
				<div class="agileinfo_banner_bottom_grid_three_left">
					<div class="wthree_banner_bottom_grid_three_left1 grid">
						<figure class="effect-roxy">
							<img src="images/a2.jpg" alt=" " class="img-responsive" />
							<figcaption>
								<h3><span>M</span>ending</h3>
								<p>Vestibulum pulvinar lobortis lorem lectus pretium non.</p>
							</figcaption>			
						</figure>
					</div>
					<p class="w3_agileits_para">Pellentesque vehicula augue eget nisl ullamcorper, 
						molestie blandit ipsum auctor. Mauris volutpat augue dolor.</p>
				</div>
				<div class="agileinfo_banner_bottom_grid_three_left">
				<p class="w3_agileits_para">Pellentesque vehicula augue eget nisl ullamcorper, 
						molestie blandit ipsum auctor. Mauris volutpat augue dolor.</p>
					<div class="wthree_banner_bottom_grid_three_left1 grid">
						<figure class="effect-roxy">
							<img src="images/a3.jpg" alt=" " class="img-responsive" />
							<figcaption>
								<h3><span>D</span>esigning</h3>
								<p>Vestibulum pulvinar lobortis lorem lectus pretium non.</p>
							</figcaption>			
						</figure>
					</div>
				</div>
				<div class="clearfix"> </div>
				</div>
				<div class="col-md-4 agileinfo_banner_bottom_grid_three_left bnr-btm3">
					<div class="wthree_banner_bottom_grid_three_left1 grid">
						<figure class="effect-roxy">
							<img src="images/a4.jpg" alt=" " class="img-responsive" />
							<figcaption>
								<h3><span>A</span>lteration</h3>
								<p>Vestibulum pulvinar lobortis lorem lectus pretium non.</p>
							</figcaption>			
						</figure>
					</div>
					<p class="w3_agileits_para">Pellentesque vehicula augue eget nisl ullamcorper, 
						molestie blandit ipsum auctor. Mauris volutpat augue dolor.</p>
				</div>
				<div class="clearfix"> </div>
</div>
</div>
<!--//Latest works-->
<!-- services -->
	<div class="services" id="services">
		<div class="container">
		<div class="tittle-agileinfo">
				<h3>Featured Services</h3>
			</div>
			<div class="w3_agileits_services_grids">
			<div class="w3_agileits_services_left">
				<img src="images/services.jpg" alt=""/>
			</div>
			<div class="w3_agileits_services_right">
				<div class="col-md-6 w3_agileits_services_grid">
					<div class="w3_agileits_services_grid_agile">
						<div class="w3_agileits_services_grid_1">
							<i class="fa fa-female" aria-hidden="true"></i>
						</div>
						<h3>Designing</h3>
						<p>Donec semper rutrum ipsum et bibendum. Sed condimentum dolor velit.</p>
					</div>
				</div>
				<div class="col-md-6 w3_agileits_services_grid">
					<div class="w3_agileits_services_grid_agile">
						<div class="w3_agileits_services_grid_1">
							<i class="fa fa-scissors" aria-hidden="true"></i>
						</div>
						<h3>Alteration</h3>
						<p>Donec semper rutrum ipsum et bibendum. Sed condimentum dolor velit.</p>
					</div>
				</div>
				<div class="col-md-6 w3_agileits_services_grid">
					<div class="w3_agileits_services_grid_agile">
						<div class="w3_agileits_services_grid_1">
							<i class="fa fa-thumb-tack" aria-hidden="true"></i>
						</div>
						<h3>Sewing</h3>
						<p>Donec semper rutrum ipsum et bibendum. Sed condimentum dolor velit.</p>
					</div>
				</div>
				<div class="col-md-6 w3_agileits_services_grid">
					<div class="w3_agileits_services_grid_agile">
						<div class="w3_agileits_services_grid_1">
							<i class="fa fa-puzzle-piece" aria-hidden="true"></i>
						</div>
						<h3>applique</h3>
						<p>Donec semper rutrum ipsum et bibendum. Sed condimentum dolor velit.</p>
					</div>
				</div>
				<div class="col-md-6 w3_agileits_services_grid">
					<div class="w3_agileits_services_grid_agile">
						<div class="w3_agileits_services_grid_1">
							<i class="fa fa-thumbs-o-up" aria-hidden="true"></i>
						</div>
						<h3>modernization</h3>
						<p>Donec semper rutrum ipsum et bibendum. Sed condimentum dolor velit.</p>
					</div>
				</div>
				<div class="col-md-6 w3_agileits_services_grid">
					<div class="w3_agileits_services_grid_agile">
						<div class="w3_agileits_services_grid_1">
							<i class="fa fa-link" aria-hidden="true"></i>
						</div>
						<h3>Mending</h3>
						<p>Donec semper rutrum ipsum et bibendum. Sed condimentum dolor velit.</p>
					</div>
				</div>
				<div class="clearfix"> </div>
				</div>
			</div>
		</div>
	</div>
<!-- //services -->
<!-- about -->
<div class="about-w3layouts" >
<div class="container">
	<div class="tittle-agileinfo">
				<h3 class="white-w3ls">Some Interesting Facts</h3>
			</div>
	<!-- schedule-bottom -->
	<div class="schedule-bottom">
		<div class="agileits_schedule_bottom_right">
			<div class="w3ls_schedule_bottom_right_grid">
				<h3 class="subheading-w3l white-w3ls">Sewing <span>Designs</span> can change how you look at <span>yourself</span>.</h3>
				<p>Suspendisse varius turpis efficitur erat laoreet dapibus. 
					Mauris sollicitudin scelerisque commodo.</p>
				<div class="col-md-4 w3l_schedule_bottom_right_grid1">
					<i class="fa fa-user-o" aria-hidden="true"></i>
					<h4>Customers</h4>
					<h5 class="counter">792</h5>
				</div>
				<div class="col-md-4 w3l_schedule_bottom_right_grid1">
					<i class="fa fa-calendar-o" aria-hidden="true"></i>
					<h4>Designs</h4>
					<h5 class="counter">533</h5>
				</div>
				<div class="col-md-4 w3l_schedule_bottom_right_grid1">
					<i class="fa fa-shield" aria-hidden="true"></i>
					<h4>Awards</h4>
					<h5 class="counter">95</h5>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
		<div class="clearfix"> </div>
	</div>
<!-- //schedule-bottom -->
</div>
</div>
<!-- //about-bottom -->
<!-- team -->
	<div class="team" id="experts">
		<div class="container">
			<div class="tittle-agileinfo">
			<h3>Meet our experts</h3>
			</div>
			<div class="w3ls_banner_bottom_grids">
			<div class="col-md-8 team-agileits-left">
				<div class="w3_agile_team_grid">
					<div class="w3layouts_team_grid team1">
						<div class="w3layouts_team_grid_pos">
							<div class="wthree_text">
								<ul class="agileits_social_list">
									<li><a href="#" class="w3_agile_facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
									<li><a href="#" class="agile_twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
									<li><a href="#" class="w3_agile_dribble"><i class="fa fa-dribbble" aria-hidden="true"></i></a></li>
								</ul>
							</div>
						</div>
					</div>
						<div class="team1-info-w3ls">
						<h6>Regan Cole</h6>
						<span>Designer</span>
						<p>Donec semper rutrum ipsum et bibendum.</p>
						</div>
						<div class="clearfix"> </div>
				</div>
				<div class="w3_agile_team_grid">
					<div class="w3layouts_team_grid team2">
						<div class="w3layouts_team_grid_pos">
							<div class="wthree_text">
								<ul class="agileits_social_list">
									<li><a href="#" class="w3_agile_facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
									<li><a href="#" class="agile_twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
									<li><a href="#" class="w3_agile_dribble"><i class="fa fa-dribbble" aria-hidden="true"></i></a></li>
								</ul>
							</div>
						</div>
					</div>
						<div class="team2-info-w3ls">
						<h6>Sydney Taft</h6>
						<span>Designer</span>
						<p>Donec semper rutrum ipsum et bibendum.</p>
						</div>
						<div class="clearfix"> </div>
				</div>
				</div>
				<div class="col-md-4 team-agileits-right">
				<div class="w3_agile_team_grid">
					<div class="w3layouts_team_grid team3">
						<div class="w3layouts_team_grid_pos">
							<div class="wthree_text">
								<ul class="agileits_social_list">
									<li><a href="#" class="w3_agile_facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
									<li><a href="#" class="agile_twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
									<li><a href="#" class="w3_agile_dribble"><i class="fa fa-dribbble" aria-hidden="true"></i></a></li>
								</ul>
							</div>
						</div>
					</div>
					<div class="team3-info-w3ls">
						<h6>Chris Robinson</h6>
						<span>Designer</span>
						<p>Donec semper rutrum ipsum et bibendum.</p>
					</div>
					<div class="clearfix"> </div>
				</div>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
<!-- //team -->
<!-- gallery -->	
	<div id="gallery" class="gallery">
		<div class="tittle-agileinfo">
			<h3>Designs & works</h3>
		</div>
		<div class="w3ls_banner_bottom_grids">
			<div class="bs-example bs-example-tabs" role="tabpanel" data-example-id="togglable-tabs">
				<ul id="myTab" class="nav nav-tabs" role="tablist">
					<li role="presentation" class="active"><a href="#designs" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">Designs</a></li>
					<li role="presentation"><a href="#Alterations" role="tab" id="Alterations-tab" data-toggle="tab" aria-controls="Alterations">Alterations</a></li>
					<li role="presentation"><a href="#Mending" role="tab" id="Mending-tab" data-toggle="tab" aria-controls="Mending">Mending</a></li>
				</ul>
				<div id="myTabContent" class="tab-content">
					<div role="tabpanel" class="tab-pane fade in active" id="designs" aria-labelledby="home-tab">
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g1.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g1.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g2.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g2.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g3.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g3.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g4.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g4.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g5.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g5.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g6.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g6.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g7.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g7.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g8.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g8.jpg" alt=" " class="img-responsive" />
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="clearfix"> </div>
					</div>
					<div role="tabpanel" class="tab-pane fade" id="Alterations" aria-labelledby="Alterations-tab">
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g9.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g9.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g10.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g10.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g11.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g11.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g12.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g12.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="clearfix"> </div>
					</div>
					<div role="tabpanel" class="tab-pane fade" id="Mending" aria-labelledby="Mending-tab">
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g8.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g8.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g13.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g13.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g14.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g14.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g15.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g15.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g16.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g16.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="col-md-3 w3layouts_gallery_grid">
							<a title="Donec sapien massa, placerat ac sodales ac, feugiat quis est." href="images/g17.jpg">
								<div class="w3layouts_team_grid">
									<img src="images/g17.jpg" alt=" " class="img-responsive">
									<div class="w3layouts_team_grid_pos">
										<div class="wthree_text">
											<h4>Sewing</h4>
											<p>Great look in Outfit</p>
										</div>
									</div>
								</div>
							</a>
						</div>
						<div class="clearfix"> </div>
					</div>
				</div>
			</div>
		</div>
	</div>
<!-- //gallery -->
<div class="contact" id="contact">
		<div class="container">
			<div class="tittle-agileinfo">
				<h3>send us a mail</h3>
			</div>
			<div class="agile-contact-grids">
				<div class="agile-contact-left">
					<div class="contact-form">
						<h3 class="white-w3ls subheading-w3l">Contact Form</h3>
						<form action="#" method="post">
								<input type="text" name="Name" placeholder="Name" required="">
								<input type="email" name="Email" placeholder="Email" required=""> 
								<input type="text" name="Subject" placeholder="Subject" required="">
								<textarea name="Message" placeholder="Message" required=""></textarea>
							<input type="submit" value="SEND">
						</form>
					</div>
					<div class="address-grid">
						<h3 class="subheading-w3l">Our Address</h3>
						<ul class="w3_address">
							<li><i class="fa fa-map-marker" aria-hidden="true"></i><span>Location</span><br>Kingsbourne House, 229 High Holborn, London, UK</li>
							<li><i class="fa fa-mobile" aria-hidden="true"></i><span>Phone</span><br>+1234 567 567</li>
							<li><i class="fa fa-envelope-o" aria-hidden="true"></i><span>Email</span><br><a href="mailto:info@example.com">info@example.com</a></li>
						</ul>
					</div>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
<h6 class="contact-w3ls">Call <span>001 234 5678</span> to make an appointment</h6>
<div class="footer-w3layouts">
<div class="container">
	<div class="col-md-4 footer-grids">
		<h3>Services</h3>					
		<ul class="b-nav">
			<li><a class="scroll" href="index.html">Home</a></li>
			<li><a class="scroll" href="#about" >About</a></li>
			<li><a class="scroll" href="#works">Latest Works</a></li>
			<li><a class="scroll" href="#services">Services</a></li>
			<li><a class="scroll" href="#experts">Experts</a></li>
		</ul>
	</div>
	<div class="col-md-4 footer-grids">
		<h3>About Sewing</h3>
		<p>Donec semper rutrum ipsum et bibendum. Sed condimentum dolor velit.</p>
		<div class="botton-agileits">
			<a href="#" class="hvr-rectangle-in" data-toggle="modal" data-target="#myModal1" >know more</a>
		</div>
		<ul class="agileits_social_list">
									<li><a href="#" class="w3_agile_facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
									<li><a href="#" class="agile_twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
									<li><a href="#" class="w3_agile_dribble"><i class="fa fa-dribbble" aria-hidden="true"></i></a></li>
								</ul>
	</div>
	<div class="col-md-4 footer-grids">
		<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2482.7618840525743!2d-0.12205158417192101!3d51.5175843796368!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x48761b3507bfbc71%3A0x34ba2cc6c33fe56f!2sKrispy+Kreme!5e0!3m2!1sen!2sin!4v1490078766787"></iframe>
	</div>
</div>
</div>
	<!-- //contact -->
<!--footer-->
<div class="copy">
	<div class="container">
		<p>&copy; 2017 Sewing . All Rights Reserved | Design by <a href="http://www.51qianduan.com//">xmoban.cn</a> </p>
	</div>
</div>
<!--/footer -->
<!-- js -->
<script src="js/modernizr.js"></script>	<!--banner text -->
<script src="js/main.js"></script><!--banner text -->
<!-- stats -->
	<script>
		$('.counter').countUp();
	</script>
<!-- //stats -->
<!-- Lightbox -->
	<script>
		$('.w3layouts_gallery_grid a').simpleLightbox();
	</script>
<!-- //Lightbox -->
<!-- smooth scrolling -->
	<script type="text/javascript">
		$(document).ready(function() {
		/*
			var defaults = {
			containerID: 'toTop', // fading element id
			containerHoverID: 'toTopHover', // fading element hover id
			scrollSpeed: 1200,
			easingType: 'linear' 
			};
		*/								
		$().UItoTop({ easingType: 'easeOutQuart' });
		});
	</script>
	<a href="#home" class="scroll" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
<!-- //smooth scrolling -->
	<!-- start-smoth-scrolling -->
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$(".scroll").click(function(event){		
			event.preventDefault();
			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
		});
	});
</script>
<!-- start-smoth-scrolling -->



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


热门标签: 行业 企业 公司 工厂 分类 响应式 自适应 设备 风格 颜色 企业 行业 公司 工厂 bootstrap bootstrap自适应 bootstrap响应式 pc+wap 移动+电脑 手机+电脑 简洁 简约 简单 白色 宽屏 全屏 满屏 设计 设计公司
×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

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

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