From 349186470ea153c66bde4857bf1f3244a7ea3982 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BD=95=E9=9B=A8=E8=8F=81?= <10174102126@stu.ecnu.edu.cn>
Date: Sun, 20 Dec 2020 11:35:12 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=89=8D=E7=AB=AF=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

添加前端代码
---
 .../style-transform-master/html/index.html         | 965 +++++++++++++++++++++
 1 file changed, 965 insertions(+)
diff --git a/style-transform-master/style-transform-master/html/index.html b/style-transform-master/style-transform-master/html/index.html
index e69de29..46b9bf7 100644
--- a/style-transform-master/style-transform-master/html/index.html
+++ b/style-transform-master/style-transform-master/html/index.html
@@ -0,0 +1,965 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+	<meta name="description" content="Businnes, Portfolio, Corporate">
+	<meta name="Author" content="WebThemez">
+	<title>Home</title>
+	<link rel="stylesheet" href="css/normalize.css">
+	<link rel="stylesheet" href="css/bootstrap.min.css">
+	<link rel="stylesheet" href="css/font-awesome/css/font-awesome.min.css" />
+	<link rel="stylesheet" href="elegant_font/style.css" />
+	<!--[if lte IE 7]><script src="elegant_font/lte-ie7.js"></script><![endif]-->
+	<link rel="stylesheet" href="css/magnific-popup.css">
+	<link rel="stylesheet" href="css/slider-pro.css">
+	<link rel="stylesheet" href="css/owl.carousel.css">
+	<link rel="stylesheet" href="css/owl.theme.css">
+	<link rel="stylesheet" href="css/owl.transitions.css">
+	<link rel="stylesheet" href="css/animate.css">
+	<link rel="stylesheet" href="elegant_font/style.css">
+	<link rel="stylesheet" href="css/style.css">
+
+
+
+	<!--[if lt IE 9]>
+	<script src="js/html5shiv.min.js"></script>
+	<script src="js/respond.min.js"></script>
+	<script type="text/javascript" src="js/selectivizr.js"></script>
+<![endif]-->
+</head>
+
+<body>
+	<!-- Preloader -->
+	<div class="preloader">
+		<div class="status"></div>
+	</div>
+
+	<!-- Header End -->
+	<header>
+		<!-- Navigation Menu start-->
+
+		<nav id="topNav" class="navbar navbar-default main-menu">
+			<div class="container">
+				<button class="navbar-toggler hidden-md-up pull-right" type="button" data-toggle="collapse"
+					data-target="#collapsingNavbar">
+					☰
+				</button>
+				<a class="navbar-brand page-scroll" href="#slider"><img class="logo" id="logo" src="images/logo.png"
+						alt="logo"></a>
+				<div class="collapse navbar-toggleable-sm" id="collapsingNavbar">
+					<ul class="nav navbar-nav">
+						<li class="active">
+							<a href="#slider">HOME</a>
+						</li>
+						<li>
+							<a href="#about">ABOUT</a>
+						</li>
+						<li>
+							<a href="#services">SERVICES</a>
+						</li>
+						<li>
+							<a href="#menuCard">MENU</a>
+						</li>
+						<li>
+							<a href="#portfolio">RESULT</a>
+						</li>
+						<li>
+							<a href="#team">MEMBERS</a>
+						</li>
+						<li>
+							<a href="#clients">FEEDBACK</a>
+						</li>
+						<li>
+							<a href="#contact">CONTACT US</a>
+						</li>
+					</ul>
+				</div>
+			</div>
+		</nav>
+
+
+	</header>
+	<!-- Header End -->
+
+
+	<section class="slider-pro slider" id="slider">
+		<div class="sp-slides">
+
+			<!-- Slides -->
+			<div class="sp-slide main-slides">
+				<div class="img-overlay"></div>
+
+				<img class="sp-image" src="images/slider/slider-img-1.jpg" alt="Slider 1" />
+
+				<h1 class="sp-layer slider-text-big" data-position="left" data-show-transition="left"
+					data-hide-transition="right" data-show-delay="1500" data-hide-delay="200">
+					<span class="highlight-texts">Healthy Food</span>
+				</h1>
+
+				<p class="sp-layer" data-position="left" data-vertical="15%" data-show-delay="2000"
+					data-hide-delay="200" data-show-transition="left" data-hide-transition="right">
+					Lorem ipsum dolor sit amectetur adipici
+				</p>
+			</div>
+			<!-- Slides End -->
+
+			<!-- Slides -->
+			<!-- <div class="sp-slide main-slides">
+		<div class="img-overlay"></div>
+			<img class="sp-image" src="images/slider/slider-img-2.jpg" alt="Slider 2"/>
+
+			<h1 class="sp-layer slider-text-big"
+			data-position="left" data-show-transition="left" data-hide-transition="right" data-show-delay="1500" data-hide-delay="200">
+			<span class="highlight-texts">Amazing Ambiance</span>
+			</h1>
+
+			<p class="sp-layer"
+			data-position="left" data-vertical="15%" data-show-delay="2000" data-hide-delay="200" data-show-transition="left" data-hide-transition="right">
+				Lorem ipsum dolor sit ametectetur adipis
+			</p>
+		</div> -->
+			<!-- Slides End -->
+
+			<!-- Slides -->
+			<!-- <div class="sp-slide main-slides">
+			<div class="img-overlay"></div>
+
+			<img class="sp-image" src="images/slider/slider-img-3.jpg" alt="Slider 3"/>
+
+			<h1 class="sp-layer slider-text-big"
+			data-position="left" data-show-transition="left" data-hide-transition="right" data-show-delay="1500" data-hide-delay="200">
+			<span class="highlight-texts">Best Sea Food</span>
+			</h1>
+
+			<p class="sp-layer"
+			data-position="left" data-vertical="15%" data-show-delay="2000" data-hide-delay="200" data-show-transition="left" data-hide-transition="right">
+				Lorem ipsum dolor sit ansectetur adipis
+			</p>
+		</div> -->
+			<!-- Slides End -->
+
+		</div>
+	</section>
+	<!-- Main Slider End -->
+
+
+	<section id="about" class="about-sec section-wrapper description">
+		<div class="container">
+			<div class="row">
+				<!-- Section Header -->
+				<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+					<h2><span class="highlight-text">About</span></h2>
+
+					<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">Lorem ipsum dolor sit amet,
+						consectetur adipisicing elit. Quod, nam corporis quas, saepe minima error aperiam dolorum
+						aliquam, quis deserunt eos eius quisquam odio itaque.</p>
+				</div>
+				<!-- Section Header End -->
+
+				<div class="col-md-6 col-sm-6 col-xs-12 custom-sec-img wow fadeInDown">
+					<img src="images/features.jpg" alt="Custom Image">
+				</div>
+
+				<div class="col-md-6 col-sm-6 col-xs-12 customized-text wow fadeInDown black-ed">
+					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa sit, numquam amet voluptatibus
+						obcaecati ea maiores totam nostrum, ad iure rerum quas harum ipsum. lobcaecati ea maiores totam
+						nostrum, ad iure rerum quas harum ipsum. Rem ea ducimus quos quae quo.</p>
+					<div class="row">
+						<div class="col-md-11">
+							<strong>Bootstrap</strong>
+							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam iusto, natus est
+								ducimus saepe laborum</p>
+						</div>
+					</div>
+					<div class="row">
+						<div class="col-md-11">
+							<strong>Responisve Theme</strong>
+							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam iusto, natus est
+								ducimus saepe laborum Lorem ipsum dolor sit amet.</p>
+						</div>
+					</div>
+					<div class="row">
+						<div class="col-md-11">
+							<strong>HTML5/CSS3</strong>
+							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam iusto, natus est
+								ducimus saepe laborum Lorem ipsum dolor sit amet.</p>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+
+	<section id="services" class="section-wrapper">
+		<div class="container">
+			<div class="row">
+
+				<!-- Section Header -->
+				<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+					<h2><span class="highlight-text">Services</span></h2>
+
+					<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">Lorem ipsum dolor sit amet,
+						consectetur adipisicing elit. Quod, nam corporis quas, saepe minima error aperiam dolorum
+						aliquam, quis deserunt eos eius quisquam odio itaque.</p>
+				</div>
+				<!-- Section Header End -->
+
+				<div class="our-services">
+
+
+					<div class="row">
+						<div class="col-md-4 col-sm-4 col-xs-12 text-xs-center wow fadeInDown" data-wow-delay=".2s">
+							<div class="service-box">
+								<div class="icon">
+									<h3>Breakfast</h3>
+								</div>
+								<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero praesentium quam
+									nulla.</p>
+								<img src="images/breakfast.jpg" alt="Custom Image">
+							</div>
+						</div>
+						<div class="col-md-4 col-sm-4 col-xs-12 text-xs-center wow fadeInDown" data-wow-delay=".2s">
+							<div class="service-box">
+								<div class="icon">
+									<h3>Lunch </h3>
+								</div>
+
+								<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero praesentium quam
+									nulla.</p>
+								<img src="images/lunch.jpg" alt="Custom Image">
+							</div>
+						</div>
+						<div class="col-md-4 col-sm-4 col-xs-12 text-xs-center wow fadeInDown" data-wow-delay=".2s">
+							<div class="service-box">
+								<div class="icon">
+									<h3>Dinner</h3>
+								</div>
+
+								<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero praesentium quam
+									nulla.</p>
+								<img src="images/dinner.jpg" alt="Custom Image">
+							</div>
+						</div>
+
+					</div>
+					<div class="row">
+
+						<div class="col-md-4 col-sm-4 col-xs-12 text-xs-center wow fadeInDown" data-wow-delay=".1s">
+							<div class="service-box">
+								<div class="icon">
+									<i class="icon_star-half_alt"></i>
+									<h3>Buffeat</h3>
+								</div>
+
+								<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero praesentium quam
+									nulla.</p>
+							</div>
+						</div>
+						<div class="col-md-4 col-sm-4 col-xs-12 text-xs-center wow fadeInDown" data-wow-delay=".1s">
+							<div class="service-box">
+								<div class="icon">
+									<i class="icon_music"></i>
+									<h3>Parties</h3>
+								</div>
+
+								<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero praesentium quam
+									nulla.</p>
+							</div>
+						</div>
+						<div class="col-md-4 col-sm-4 col-xs-12 text-xs-center wow fadeInDown" data-wow-delay=".1s">
+							<div class="service-box">
+								<div class="icon">
+									<i class="icon_cog"></i>
+									<h3>Rooms</h3>
+								</div>
+
+								<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero praesentium quam
+									nulla.</p>
+							</div>
+						</div>
+					</div>
+				</div>
+
+			</div>
+		</div>
+	</section>
+
+	<section class="menus style3" id="menuCard">
+		<div class="container">
+			<div class="row">
+
+				<!-- Section Header -->
+				<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+					<h2><span class="highlight-text">Menu Card</span></h2>
+
+					<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">Lorem ipsum dolor sit amet,
+						consectetur adipisicing elit. Quod, nam corporis quas, saepe minima error aperiam dolorum
+						aliquam, quis deserunt eos eius quisquam odio itaque.</p>
+				</div>
+				<!-- Section Header End -->
+
+				<div class="menus-container">
+					<!-- menu -->
+					<div class="menu row">
+						<div class="col-md-6 wow fadeInRight animated"
+							style="visibility: visible; animation-name: fadeInRight;">
+							<div class="menu-column">
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Chicken Masala</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>5.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with “butter”</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Mango Rice with Curd</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>16.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with chat masala</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Mutton Fry Rice</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>22.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with pure meat</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Eggs Mancuriya</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>22.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with Vegies</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Chicken Currey </h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>15.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with curry leafs</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+							</div><!-- /menu-column -->
+						</div><!-- /col-md-6 -->
+						<div class="col-md-6 wow fadeInLeft animated"
+							style="visibility: visible; animation-name: fadeInLeft;">
+							<div class="menu-column">
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Pure Veg Salad</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>5.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with all veg</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Veg Fry Rice</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>16.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with best fry</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Chines Noodles</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>22.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with all spices</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Chicken Manchuriah</h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>22.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with hot and wet</span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+								<div class="food">
+									<div class="food-desc">
+										<h6 class="food-name">Veg Fry Rice </h6>
+										<div class="dots"></div>
+										<div class="food-price">
+											<span>15.00</span>
+										</div><!-- /food-price -->
+									</div><!-- /food-desc -->
+									<div class="food-details">
+										<span>with egg and chicken </span>
+									</div><!-- /food-details -->
+								</div><!-- /food -->
+							</div><!-- /menu-column -->
+						</div><!-- /col-md-6 -->
+					</div><!-- /row -->
+				</div><!-- /menu-carousel -->
+			</div><!-- /menus-container -->
+		</div><!-- /container -->
+	</section>
+	<div class="tlinks">Collect from <a href="http://www.baisheng999.com/">手机网站模板</a></div>
+
+	<section id="portfolio" class="bgSection portfolio-section">
+		<div class="container">
+			<div class="row">
+
+				<!-- Section Header -->
+				<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+					<h2><span class="highlight-text">RESULT</span></h2>
+
+					<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">Lorem ipsum dolor sit amet,
+						consectetur adipisicing elit. Quod, nam corporis quas, saepe minima error aperiam dolorum
+						aliquam, quis deserunt eos eius quisquam odio itaque.</p>
+				</div>
+				<!-- Section Header End -->
+
+			</div>
+		</div>
+
+		<!-- Works -->
+		<div class="portfolio-works wow fadeIn" data-wow-duration="2s">
+
+			<!-- Filter Button Start -->
+			<div id="portfolio-filter" class="portfolio-filter-btn-group">
+				<ul>
+					<li>
+						<a href="#" class="selected" data-filter="*">ALL</a>
+						<a href="#" data-filter=".web">SOURCE</a>
+						<a href="#" data-filter=".seo">STYLE</a>
+						<a href="#" data-filter=".works">RESULT</a>
+						<!-- <a href="#" data-filter=".brands">EUROPEN</a> -->
+					</li>
+				</ul>
+			</div>
+			<!-- Filter Button End -->
+
+			<div class="portfolio-items">
+<!-- <div> -->
+				<!-- Portfolio Items -->
+				<!-- <div class="item portfolio-item web seo works">
+
+					<img src="images/img-portfolio/portfolio1.jpg" alt="">
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio1.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+
+				</div> -->
+				<!-- Portfolio Items End -->
+
+				<!-- Portfolio Items -->
+				<div class="item portfolio-item web">
+
+					<img src="images/img-portfolio/portfolio2.jpg" alt="" width="1000px">
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio2.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+
+				</div>
+				<!-- Portfolio Items End -->
+
+				<!-- Portfolio Items -->
+				<div class="item portfolio-item seo">
+
+					<img src="images/img-portfolio/portfolio3.jpg" alt="" >
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio3.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+
+				</div>
+				<!-- Portfolio Items End -->
+
+				<!-- Portfolio Items -->
+				<div class="item portfolio-item works">
+
+					<img src="images/img-portfolio/portfolio4.jpg" alt="" >
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio4.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+				</div>
+				<!-- Portfolio Items -->
+
+				<!-- Portfolio Items -->
+				<!-- <div class="item portfolio-item web brands">
+
+					<img src="images/img-portfolio/portfolio5.jpg" alt="">
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio5.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+
+				</div> -->
+				<!-- Portfolio Items End -->
+
+				<!-- Portfolio Items -->
+				<!-- <div class="item portfolio-item works seo">
+
+					<img src="images/img-portfolio/portfolio6.jpg" alt="">
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio6.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+
+				</div> -->
+				<!-- Portfolio Items End -->
+
+				<!-- <div class="item portfolio-item brands seo">
+
+					<img src="images/img-portfolio/portfolio1.jpg" alt="">
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio7.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+
+				</div> -->
+				<!-- Portfolio Items End -->
+
+				<!-- Portfolio Items -->
+				<!-- <div class="item portfolio-item web seo works">
+
+					<img src="images/img-portfolio/portfolio2.jpg" alt="">
+					<div class="portfolio-details-wrapper">
+						<div class="portfolio-details">
+							<div class="portfolio-meta-btn">
+								<ul class="work-meta">
+									<li class="lighbox"><a href="images/img-portfolio/portfolio8.jpg"
+											class="featured-work-img"><i class="fa fa-search-plus"></i></a></li>
+								</ul>
+							</div>
+						</div>
+					</div>
+
+				</div> -->
+				<!-- Portfolio Items End -->
+
+
+
+			</div>
+		</div>
+		<!-- Works End -->
+
+
+	</section>
+	<!-- Portfolio Section End -->
+
+
+	<section id="info" class="info-section">
+		<div class="container text-xs-center">
+			<!-- Section Header -->
+			<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+				<h2><span class="highlight-text">Stats</span></h2>
+
+				<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">Lorem ipsum dolor sit amet,
+					consectetur adipisicing elit. Quod, nam corporis quas, saepe minima error aperiam dolorum aliquam,
+					quis deserunt eos eius quisquam odio itaque.</p>
+			</div>
+			<!-- Section Header End -->
+			<div class="row wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;">
+				<div class="col-md-3 col-sm-6 col-xs-12 text-xs-center">
+
+					<i class="icon_mic_alt wow pulse" style="visibility: visible; animation-name: pulse;"></i>
+					<h4>Margins</h4>
+					<h1 class="text-primary">100,000</h1>
+				</div>
+				<div class="col-md-3 col-sm-6 col-xs-12 text-xs-center">
+
+					<i class="icon_gift_alt wow pulse" style="visibility: visible; animation-name: pulse;"></i>
+					<h4>Completed</h4>
+					<h1 class="text-primary">34201</h1>
+				</div>
+				<div class="col-md-3 col-sm-6 col-xs-12 text-xs-center">
+
+					<i class="icon_mobile wow pulse" style="visibility: visible; animation-name: pulse;"></i>
+					<h4>Projects</h4>
+					<h1 class="text-primary">152</h1>
+				</div>
+				<div class="col-md-3 col-sm-6 col-xs-12 text-xs-center">
+
+					<i class="icon_lightbulb_alt wow pulse" style="visibility: visible; animation-name: pulse;"></i>
+					<h4>Customers</h4>
+					<h1 class="text-primary">56500</h1>
+				</div>
+			</div>
+		</div>
+	</section>
+
+	<section id="team" class="bgSection teams-section">
+		<div class="parallax-overlay"></div>
+		<div class="teams-wrapper wow fadeInDown">
+			<div class="container">
+				<div class="row">
+
+					<!-- Section Header -->
+					<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+						<h2><span class="highlight-text-inverted">MEMBERS</span></h2>
+
+						<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">Lorem ipsum dolor sit
+							amet, consectetur adipisicing elit. Quod, nam corporis quas, saepe minima error aperiam
+							dolorum aliquam, quis deserunt eos eius quisquam odio itaque.</p>
+					</div>
+
+					<!-- teams Slider -->
+					<div id="teams" class="owl-carousel teams">
+
+						<!-- Slides -->
+						<div class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">
+							<img src="images/img-teams/team1.jpg" alt="">
+							<p>何雨菁</p>
+							<p>学号：10174102126</p>
+							<p>邮箱：heyujing0@163.com</p>
+
+						</div>
+						<!-- Slides End -->
+
+						<!-- Slides -->
+						<div class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">
+							<img src="images/img-teams/team2.jpg" alt="">
+							<p class="client-info">Randy Dode</p>
+							<p>Lorem ipsum dolor sit amet, consectetur adipisic</p>
+						</div>
+						<!-- Slides End -->
+
+						<!-- Slides -->
+						<div class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">
+							<img src="images/img-teams/team3.jpg" alt="">
+							<p>章可儿</p>
+							<p>学号：10182100208</p>
+							<p>邮箱：19966422680@163.com</p>
+
+						</div>
+						<!-- Slides End -->
+
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+
+
+	<!-- Clients Section -->
+	<section id="clients" class="clients-section">
+		<!-- Container Ends -->
+		<div class="container">
+			<div class="row">
+				<!-- Section Header -->
+				<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+					<h2><span class="highlight-text">Customer Feedback</span></h2>
+				</div>
+				<!-- Section Header End -->
+				<div class="row">
+					<div class="col-md-8 col-md-offset-2">
+						<div class="testimonials">
+							<div class="active item">
+								<blockquote>
+									<p>Denim you probably haven't heard of. Lorem ipsum dolor met consectetur
+										adipisicing sit amet, consectetur adipisicing elit, of them jean shorts sed
+										magna aliqua. Lorem ipsum dolor met.</p>
+								</blockquote>
+								<div class="carousel-info">
+									<img alt="" src="images/img1-small.jpg" class="pull-left">
+									<div class="pull-left">
+										<span class="testimonials-name">Lina Mars</span>
+										<span class="testimonials-post">Commercial Director</span>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div><!-- Container Ends -->
+	</section>
+	<!-- Client Section End -->
+
+	<section id="contact" class="section-wrapper contact-section" data-stellar-background-ratio="0.5">
+		<div class="parallax-overlay"></div>
+		<div class="container">
+			<div class="row">
+
+				<!-- Section Header -->
+				<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
+					<h2><span class="highlight-text">Contact Us</span></h2>
+
+					<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">We love feedback. Fill out
+						the form below and we'll get back to you as soon as possible. in minus distinctio dolores ipsam.
+					</p>
+				</div>
+				<!-- Section Header End -->
+
+				<div class="contact-details">
+
+
+					<!-- Contact Form -->
+					<div class="contact-form wow bounceInRight">
+
+						<!--NOTE: Update your email Id in "contact_me.php" file in order to receive emails from your contact form-->
+						<form name="sentMessage" id="contactForm" novalidate method="post">
+							<div class="col-md-6">
+								<img id="cropedBigImg0" src="" class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1"/>
+								<input type="file"  id="chooseImage0"
+									accept="image/gif,image/jpeg, image/png, image/jpg" />
+								<p class="help-block"></p>
+							</div>
+
+							<div class="col-md-6">
+								<img id="cropedBigImg1" src="" class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1"/>
+								<input type="file"  id="chooseImage1"
+									accept="image/gif,image/jpeg, image/png, image/jpg" />
+							</div>
+
+							<div class="col-md-12">
+								<textarea  class="form-control" placeholder="请输入训练轮数" id="message"></textarea>
+							</div>
+
+							<div class="col-md-8 col-md-offset-2"><br>
+								<div id="success"> </div><button type="submit" class="btn btn-primary" onclick="window.location.href = '#portfolio'">Submit
+									Message</button>
+							</div>
+						</form>
+
+
+
+
+
+
+
+
+
+
+
+						<!-- <div class="div_model">
+		<img id="cropedBigImg0" src="images/0.png" class="div_model_img"/>
+		<input type="file"class="file" accept="image/gif,image/jpeg, image/png, image/jpg"id="chooseImage0">
+	 </div> -->
+						<script>
+							function ProcessFile1(e) {
+								var src_img = document.getElementById('chooseImage0').files[0];
+								console.log(src_img);
+								if (src_img) {
+									var reader = new FileReader();
+									reader.onload = function (event) {
+										var txt = event.target.result;
+										$("#cropedBigImg0").attr('src', txt);//将图片base64字符串赋值给img的src
+										//console.log(txt)//base64
+									};
+								}
+								reader.readAsDataURL(src_img);
+							}
+
+							function ProcessFile2(e) {
+								var tar_img = document.getElementById('chooseImage1').files[0];
+								console.log(tar_img);
+								if (tar_img) {
+									var reader = new FileReader();
+									reader.onload = function (event) {
+										var txt = event.target.result;
+										$("#cropedBigImg1").attr('src', txt);//将图片base64字符串赋值给img的src
+										//console.log(txt)//base64
+									};
+								}
+								reader.readAsDataURL(tar_img);
+							}
+
+							function contentLoaded0() {
+								document.getElementById('chooseImage0').addEventListener('change',
+									ProcessFile1, false);
+							}
+							function contentLoaded1() {
+								document.getElementById('chooseImage1').addEventListener('change',
+									ProcessFile2, false);
+							}
+
+							// var model=document.getElementById('model');
+							// var input=model.querySelectorAll('input');
+							window.addEventListener("DOMContentLoaded", contentLoaded0, false);
+							window.addEventListener("DOMContentLoaded", contentLoaded1, false);
+						</script>
+
+
+
+
+
+
+
+
+
+
+
+					</div>
+
+				</div>
+			</div>
+	</section>
+
+
+
+
+	<!-- Contact Section End -->
+	<section class="footer-container">
+		<div class="container">
+			<div class="row footer-containertent">
+				<div class="col-md-4">
+					<img src="images/logo.png" alt="">
+					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Et porro quos iste ratione doloribus
+						asperiores, error omnis delectus rerum sapiente. Et, aliquam modi beatae quae in perferendis ab
+						est fugiat!</p>
+				</div>
+				<div class="col-md-4">
+					<h4>News & Updates</h4>
+					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod, nam corporis quas, saepe minima
+						error aperiam dolorum aliquam, quis deserunt eos eius quisquam odio itaque.</p>
+				</div>
+				<div class="col-md-4 contac-us">
+					<h4>Contact Us</h4>
+					<p>Lorem ipsum dolor sit amet adipisicing elit.</p>
+					<ul>
+						<li><i class="fa fa-home"></i>123 New Venu Street</li>
+						<li><i class="fa fa-phone"></i>001 123 12345 99</li>
+						<li><i class="fa fa-envelope-o"></i>support@website.com</li>
+					</ul>
+				</div>
+			</div>
+		</div>
+	</section>
+
+
+	<footer>
+
+		<div class="container">
+			<div class="row">
+				<div class="footer-containertent">
+
+					<ul class="footer-social-info">
+						<li>
+							<a href="#"><i class="fa fa-facebook"></i></a>
+						</li>
+						<li>
+							<a href="#"><i class="fa fa-twitter"></i></a>
+						</li>
+						<li>
+							<a href="#"><i class="fa fa-pinterest"></i></a>
+						</li>
+						<li>
+							<a href="#"><i class="fa fa-google-plus"></i></a>
+						</li>
+					</ul>
+					<br /><br />
+					<p>Copyright &copy; 2017.Company name All rights reserved.More Templates <a
+							href="http://www.baisheng999.com/" target="_blank" title="网站模板库">网站模板库</a> - Collect from <a
+							href="http://www.baisheng999.com/" title="网页模板" target="_blank">网页模板</a></p>
+				</div>
+			</div>
+		</div>
+	</footer>
+	<!-- Footer End -->
+
+	<script src="js/jquery-1.11.3.min.js"></script>
+	<script src="js/bootstrap.min.js"></script>
+	<script src="js/modernizr.min.js"></script>
+	<script src="js/jquery.easing.1.3.js"></script>
+	<script src="js/jquery.scrollUp.min.js"></script>
+	<script src="js/jquery.easypiechart.js"></script>
+	<script src="js/isotope.pkgd.min.js"></script>
+	<script src="js/jquery.fitvids.js"></script>
+	<script src="js/jquery.stellar.min.js"></script>
+	<script src="js/jquery.waypoints.min.js"></script>
+	<script src="js/wow.min.js"></script>
+	<script src="js/jquery.nav.js"></script>
+	<script src="js/imagesloaded.pkgd.min.js"></script>
+	<script src="js/smooth-scroll.min.js"></script>
+	<script src="js/jquery.magnific-popup.min.js"></script>
+	<script src="js/jquery.sliderPro.min.js"></script>
+	<script src="js/owl.carousel.min.js"></script>
+	<script src="contact/jqBootstrapValidation.js"></script>
+	<script src="contact/contact_me.js"></script>
+	<script src="js/custom.js"></script>
+
+</body>
+
+</html>
\ No newline at end of file
