黄色简洁风格的足球体育用品商城网站源码下载



16 60 21



模板描述:黄色简洁风格 足球体育用品 商城网站,黄色简洁风格的足球体育用品商城网站源码下载html模板下载

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/owl.theme.css">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/responsive.css">

2. 引入JS

<script src="js/modernizr-2.8.3.min.js"></script>
<script src="js/jquery-1.12.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.js"></script>
<script src="js/jquery.countdown.min.js"></script>
<script src="js/imagesloaded.pkgd.min.js"></script>
<script src="js/isotope.pkgd.min.js"></script>
<script src="js/main.js"></script>

3. HTML代码

        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
        <!-- Add your site or application content here -->
		<header>
            <div class="top-bar gray-3d-bg">
                <div class="container">
                    <div class="row">
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <div class="top-contact-info">
                                <span class="work-sans fz-13 lh-50"><img src="img/phone.png" alt=""> + 124 45 78 678 </span>
                                <span class="work-sans fz-13 lh-50"><img src="img/mail.png" alt=""> Support@mail.com</span>
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-6 col-xs-12 social-login">
                            <div class="top-social display-ib">
                                <a href="#"><i class="fa fa-facebook"></i></a>
                                <a href="#"><i class="fa fa-twitter"></i></a>
                                <a href="#"><i class="fa fa-google-plus"></i></a>
                                <a href="#"><i class="fa fa-linkedin"></i></a>
                            </div>
                            <div class="top-login display-ib lh-50">
                                <img src="img/login.png" alt="">
                                <span class="white">
                                    <a href="#">Login</a> /
                                    <a href="#"> Register</a>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="main-nav-area">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12">
                            <div class="man-nav">
                                <nav class="navbar navbar-default no-margin">
                                      <div class="navbar-header">
                                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                                          <span class="sr-only">Toggle navigation</span>
                                          <span class="icon-bar"></span>
                                          <span class="icon-bar"></span>
                                          <span class="icon-bar"></span>
                                        </button>
                                      </div>
                                      <div id="navbar" class="navbar-collapse collapse no-margin no-padding">
                                        <div class="col-md-7 col-sm-7">
                                            <ul class="nav navbar-nav">
                                              <li class="active"><a href="index.html">Home</a></li>
                                              <li><a href="about.html">About</a></li>
                                              <li><a class="" href="gallery.html">Galley </a></li>
                                              <li><a class="" href="match-fixtures.html">Fixtures</a></li>
                                            </ul>
                                        </div>
                                        <div class="col-md-5 col-sm-5">
                                            <ul class="nav navbar-nav pl-50">
                                                <li class="dropdown">
                                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Blog  <span class="caret"></span></a>
                                                <ul class="dropdown-menu">
                                                  <li><a href="blog.html">Blog</a></li>
                                                  <li><a href="blog-single.html">Blog Single</a></li>
                                                </ul>
                                              </li>
                                                <li class="dropdown">
                                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Pages  <span class="caret"></span></a>
                                                <ul class="dropdown-menu">
                                                    <li><a href="match-report.html">Match Report</a></li>
                                                    <li><a href="404.html">404 Page</a></li>
                                                </ul>
                                              </li>
                                              <li class="dropdown">
                                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Shop  <span class="caret"></span></a>
                                                <ul class="dropdown-menu">
                                                  <li><a href="shop.html">Shop</a></li>
                                                  <li><a href="shop-single.html">Shop Single</a></li>
                                                  <li><a href="my-cart.html">My Cart</a></li>
                                                  <li><a href="checkout.html">Checkout</a></li>
                                                </ul>
                                              </li>
                                              <li><a href="contact.html">Contact</a></li>
                                            </ul>
                                        </div>
                                      </div><!--/.nav-collapse -->
                                </nav>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <section>
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12 no-padding">
                        <div class="main-slider">
                            <div class="item">
                                <div class="main-slider-img">
                                    <img src="img/s1.jpg" alt="">
                                    <div class="main-slider-content slide-1">
                                        <div>
                                            <span class="label-yellow text-uppercase">10-Dec-2015</span>
                                        </div>
                                        <h2 class="oswald fz-36 text-uppercase white label-gray-t ls-2 mt-20">Best Goals of 2015 Championship</h2>
                                        <p class="fz-15 white mt-30">The Love Boat soon will be making another run the Love Boat promises something <br>everyone Today still wanted they survive as soldiers of fortune.</p>
                                        <div class="mt-30"><a href="#" class="btn-yellow-outline">Read More</a></div>
                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <div class="main-slider-img">
                                    <img src="img/s2.jpg" alt="">
                                    <div class="main-slider-content slide-2 text-center">
                                        <h2 class="oswald fz-36 text-uppercase white label-gray-t ls-2">Best Goals of 2015 Championship</h2>
                                        <p class="fz-15 white mt-30">The Love Boat soon will be making another run the Love Boat promises something <br>everyone Today still wanted they survive as soldiers of fortune.</p>
                                        <div class="mt-30"><a href="#" class="btn-yellow">Read More</a></div>
                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <div class="main-slider-img">
                                    <img src="img/s3.jpg" alt="">
                                    <div class="main-slider-content slide-3 text-right">
                                        <div>
                                            <span class="label-yellow text-uppercase">10-Dec-2015</span>
                                        </div>
                                        <h2 class="oswald fz-36 text-uppercase white label-gray-t ls-2 mt-20">Best Goals of 2015 Championship</h2>
                                        <p class="fz-15 white mt-30">The Love Boat soon will be making another run the Love Boat promises something <br>everyone Today still wanted they survive as soldiers of fortune.</p>
                                        <div class="mt-30"><a href="#" class="btn-yellow-outline">Read More</a></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="pt-150">
            <div class="container-fluid lms">
                <div class="container">
                    <div class="col-md-12 text-center">
                        <h1 class="text-uppercase ls-3 bb">Last Match <span class="yellow"> Statics</span></h1>
                        <p class="mt-50 fz-15">
                            The Love Boat soon will be making another run the Love Boat promises something <br> everyone Today still wanted they survive as soldiers of fortune.
                        </p>
                    </div>
                </div>
                <div class="row-eq-height mt-40">
                    <div class="col-md-3 mt-40 gray-eee-bg col-sm-12 col-xs-12">
                        <div class="next-match">
                            <h5 class="work-sans gray-de fz-17 text-uppercase text-medium">Next Match Starts </h5>
                            <div class="mt-100 way-big-main">
                                <span class="way-big">02</span>
                                <h4 class="work-sans fz-25 gray-de text-uppercase">Irure vs Dolors</h4>
                            </div>
                            <ul class="mt-90 list-inline text-right">
                                <li><a href="#">01</a></li>
                                <li><a href="#">02</a></li>
                                <li><a href="#">03</a></li>
                                <li><a href="#">04</a></li>
                            </ul>
                            <div class="mt-50 text-right"><a href="#" class="btn-round work-sans text-semi-bold fz-11">More Details</a></div>
                        </div>
                    </div>
                    <div class="col-md-6 mt-40 super-toto-bg col-sm-12 col-xs-12">
                        <div>
                            <h3 class="yellow text-center ls-2 fvs">Super Toto Supper Lig</h3>
                            <h6 class="mt-25 work-sans fz-15 text-semi-bold white lh-26 text-center">10 - December -2015  |  8:00 am <br>Manhatten Newyork</h6>
                            <div class="vs-team">
                                <h5 class="text-bold white text-center">1 : 2</h5>
                                <span class="oswald yellow fz-28 mt-25 center-block text-center text-bold ls-2">VS</span>
                                <div class="left-team">
                                    <img class="img-responsive" src="img/team-1.png" alt="">
                                    <h6 class="work-sans fz-14 text-bold white mt-25">AUTE IRURE DOLOR</h6>
                                </div>
                                <div class="right-team">
                                    <img class="img-responsive" src="img/team-2.png" alt="">
                                    <h6 class="work-sans fz-14 text-bold white mt-25">AUTE IRURE DOLOR</h6>
                                </div>
                            </div>
                            <div class="timeline-main mt-60">
                                <img src="img/timeline.png" alt="" class="img-responsive">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 mt-40 gray-444-bg col-sm-12 col-xs-12">
                        <div class="match-summary gray-3d-bg mt-15">
                            <div class="teams-name-header d-black-bg">
                                <div class="flag-1-team">
                                   <h4 class="text-uppercase fz-25 white"><span class="fz-15">1 : 0</span>   AUTE </h4> 
                                </div>
                                <h4 class="yellow fz-20 text-bold ls-2 text-center">VS</h4>
                                <div class="flag-2-team">
                                    <h4 class="text-uppercase fz-25 white">IRURE<span class="fz-15">0 : 2</span> </h4>
                                </div>
                            </div>
							<ul class="list-unstyled total-match-summary">
                                <li>
                                    <div class="flag-1">
                                        <h4 class="fz-20 white">1</h4>
                                        <img class="" src="img/flag-1.png" alt="">
                                    </div>
                                    <h6 class="fz-15 white fvs">Final</h6>
                                    <div class="flag-2">
                                        <h4 class="fz-20 white">2</h4>
                                        <img  src="img/flag-2.png" alt="">
                                    </div>
                                </li>
							</ul>
							<div class="table-responsive table-match-summary">
								<table class="table">
									<thead>
										<tr>
											<td class="th-ms">Match Summary</td>
											<td></td>
											<td class="th-ps">Player Stats</td>
										</tr>
									</thead>
									<tbody>
										<tr>
											<td></td>
											<td>90*</td>
											<td><span class="work-sans fz-15 white text-medium"><img src="img/yellow-card.png" alt=""> A.Ayew</span></td>
										</tr>
										<tr>
											<td><span class="work-sans fz-15 white text-medium">J.Brooks <img src="img/footbal.png" alt=""></span></td>
											<td>86*</td>
											<td></td>
										</tr>
										<tr>
											<td></td>
											<td>75*</td>
											<td><span class="work-sans fz-15 white text-medium"><img src="img/footbal.png" alt=""> J.Brooks</span></td>
										</tr>
										<tr>
											<td></td>
											<td>75*</td>
											<td><span class="work-sans fz-15 white text-medium left-i"><i><img src="img/up-down.png" alt=""></i> <span>S.Smith IN</span><span>A.James OUT</span> </span></td>
										</tr>
										<tr>
											<td></td>
											<td>98*</td>
											<td><span class="work-sans fz-15 white text-medium"><img src="img/footbal.png" alt=""> J.Brooks</span></td>
										</tr>
										<tr>
											<td><span class="work-sans fz-15 white text-medium right-i"><i><img src="img/up-down.png" alt=""></i> <span>S.Walker IN</span><span>A.James OUT</span> </span></td>
											<td>90*</td>
											<td></td>
										</tr>
									</tbody>
								</table>
							</div>
							<div class="text-center">
								<a href="#" class="work-sans text-medium fz-11 white">View More</a>
							</div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="pt-150 team-section">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 text-center">
                        <h1 class="text-uppercase ls-3 bb">Our Team <span class="yellow"> Players</span></h1>
                        <p class="mt-50 fz-15">
                            The Love Boat soon will be making another run the Love Boat promises something <br> everyone Today still wanted they survive as soldiers of fortune.
                        </p>
                    </div>
                </div>
                <div class="row mt-40">
                    <div class="col-md-4 col-sm-6 col-xs-6 mt-30 team-box">
                        <div class="player-img">
                            <img class="img-responsive" src="img/player-1.jpg" alt="">
                            <div class="player-img-hover">
                                <h4 class="fz-20 gray-de ls-1">EDWARD SMITH</h4>
                                <h6 class="work-sans fz-15 text-medium white mt-10 ls-1">Mid Field Player</h6>
                                <img src="img/sm-shirt.png" alt="" class="mt-20">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6 col-xs-6 mt-30 team-box">
                        <div class="player-img">
                            <img class="img-responsive" src="img/player-2.jpg" alt="">
                            <div class="player-img-hover">
                                <h4 class="fz-20 gray-de ls-1">EDWARD SMITH</h4>
                                <h6 class="work-sans fz-15 text-medium white mt-10 ls-1">Mid Field Player</h6>
                                <img src="img/sm-shirt.png" alt="" class="mt-20">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6 col-xs-6 mt-30 team-box">
                        <div class="player-img">
                            <img class="img-responsive" src="img/player-3.jpg" alt="">
                            <div class="player-img-hover">
                                <h4 class="fz-20 gray-de ls-1">EDWARD SMITH</h4>
                                <h6 class="work-sans fz-15 text-medium white mt-10 ls-1">Mid Field Player</h6>
                                <img src="img/sm-shirt.png" alt="" class="mt-20">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="mt-150 next-match-bg">
            <div class="container">
                <div class="row">
                    <div class="col-md-5">
                        <div class="row">
                            <div class="col-md-11">
                                <div class="one-vs-two">
                                    <div class="one-vs-two-inner">
                                        <h2 class="text-bold white text-center ls-1">VS</h2>
                                        <div class="nm-t1">
                                            <img src="img/nm1.png" alt="">
                                            <h6 class="work-sans fz-13 text-semi-bold white mt-20 text-uppercase">AUTE IRURE DOLOR</h6>
                                        </div>
                                        <div class="nm-t2">
                                            <img src="img/nm2.png" alt="">
                                            <h6 class="work-sans fz-13 text-semi-bold white mt-20 text-uppercase">AUTE IRURE DOLOR</h6>
                                        </div>
                                    </div>
                                </div>
                                <div class="one-vs-two-booking text-center">
                                    <h4 class="work-sans white text-semi-bold text-uppercase mb-20">Book The Tickets Now</h4>
                                    <a href="#" class="btn-round-yellow work-sans fz-11 text-bold yellow">Book Now</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-7 mt-70">
                        <div class="nm-details text-center">
                            <h2 class="fz-38 white ls-2 text-uppercase">Next Match Starts in</h2>
                            <div id="nm-clock"></div>
                            <h6 class="work-sans fz-14 yellow semi-bold lh-24 mt-45">10 - December -2015  |  8:00 am <br> Manhatten Newyork</h6>
                            <p class="white text-medium mt-30">Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut <br><span class="text-unbold">Boat promises something everyone Today still wanted they survive.</span> </p>
                        </div>     
                    </div>
                </div>
            </div>
        </section>
        <section class="pt-150">
            <div class="container" >
                <div class="row">
                    <div class="col-md-12 text-center">
                        <h1 class="text-uppercase ls-3 bb"><span class="yellow"> Latest</span> Gallery</h1>
                        <p class="mt-50 fz-15">
                            The Love Boat soon will be making another run the Love Boat promises something <br> everyone Today still wanted they survive as soldiers of fortune.
                        </p>
                    </div>
                </div>
                <div class="row gallery">
                    <div class="col-md-12 no-padding">
                        <div class="grid mt-50">
                            <div class="grid-item wide"><a href="#"><img class="img-responsive" src="img/g1.jpg" alt=""></a></div>
                            <div class="grid-item"><a href="#"><img class="img-responsive" src="img/g2.jpg" alt=""></a></div>
                            <div class="grid-item"><a href="#"><img class="img-responsive" src="img/g3.jpg" alt=""></a></div>
                            <div class="grid-item"><a href="#"><img class="img-responsive" src="img/g4.jpg" alt=""></a></div>
                            <div class="grid-item"><a href="#"><img class="img-responsive" src="img/g5.jpg" alt=""></a></div>
                            <div class="grid-item wide2"><a href="#"><img class="img-responsive" src="img/g6.jpg" alt=""></a></div>
                            <div class="grid-item"><a href="#"><img class="img-responsive" src="img/g7.jpg" alt=""></a></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="mt-150 ptb-150 gray-f8f8-bg latest-update">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 text-center">
                        <h1 class="text-uppercase ls-3 bb"><span class="yellow"> Latest</span> Updates</h1>
                        <p class="mt-50 fz-15">
                            The Love Boat soon will be making another run the Love Boat promises something <br> everyone Today still wanted they survive as soldiers of fortune.
                        </p>
                    </div>
                </div>
                <div class="row mt-40">
                    <div class="col-md-4 mt-30 col-sm-6 col-xs-6">
						<div class="blog-post">
							<div class="lu-img">
								<img class="img-responsive" src="img/lu-1.jpg" alt="">
								<div class="lu-content">
									<span class="likes work-sans text-semi-bold fz-12 white"><img src="img/heart-circle.png" alt=""> 10 Likes</span>
									<span class="comment work-sans text-semi-bold fz-12 white"><img src="img/comment-circle.png" alt=""> 10 Likes</span>
								</div>
							</div>
							<div class="lu-details white-bg">
								<h6 class="work-sans fz-12 gray-777">
									<span>By - <span class="yellow">Will Smith</span><span class="space">|</span></span>
									<span>Date - <span class="yellow">12 - 12 -2015</span></span>
								</h6>
								<h5 class="fz-16 gray-de text-uppercase mt-20">CHAMPIONS LEAGUE FANTASY</h5>
								<p class="fz-13 lh-25 mt-15">Sed ut perspiciatis unde  natus error voluptase accusantium doloremque explicab wanted they survive as soldiers of fortune....</p>
								<div class="mt-30">
									<a href="#" class="btn-y-outline-lg work-sans fz-12">Read More</a>
								</div>
							</div>
						</div>
                    </div>
                    <div class="col-md-4 mt-30 col-sm-6 col-xs-6">
						<div class="blog-post">
							<div class="lu-img">
								<img class="img-responsive" src="img/lu-2.jpg" alt="">
								<div class="lu-content">
									<span class="likes work-sans text-semi-bold fz-12 white"><img src="img/heart-circle.png" alt=""> 10 Likes</span>
									<span class="comment work-sans text-semi-bold fz-12 white"><img src="img/comment-circle.png" alt=""> 10 Likes</span>
								</div>
							</div>
							<div class="lu-details white-bg">
								<h6 class="work-sans fz-12 gray-777">
									<span>By - <span class="yellow">Will Smith</span>  <span class="space">|</span></span>
									<span>Date - <span class="yellow">12 - 12 -2015</span></span>
								</h6>
								<h5 class="fz-16 gray-de text-uppercase mt-20">CHAMPIONS LEAGUE FANTASY</h5>
								<p class="fz-13 lh-25 mt-15">Sed ut perspiciatis unde  natus error voluptase accusantium doloremque explicab wanted they survive as soldiers of fortune....</p>
								<div class="mt-30">
									<a href="#" class="btn-y-outline-lg work-sans fz-12">Read More</a>
								</div>
							</div>
						</div>
                    </div>
                    <div class="col-md-4 mt-30 col-sm-6 col-xs-6">
						<div class="blog-post">
							<div class="lu-img">
								<img class="img-responsive" src="img/lu-3.jpg" alt="">
								<div class="lu-content">
									<span class="likes work-sans text-semi-bold fz-12 white"><img src="img/heart-circle.png" alt=""> 10 Likes</span>
									<span class="comment work-sans text-semi-bold fz-12 white"><img src="img/comment-circle.png" alt=""> 10 Likes</span>
								</div>
							</div>
							<div class="lu-details white-bg">
								<h6 class="work-sans fz-12 gray-777">
									<span>By - <span class="yellow">Will Smith</span>  <span class="space">|</span></span>
									<span>Date - <span class="yellow">12 - 12 -2015</span></span>
								</h6>
								<h5 class="fz-16 gray-de text-uppercase mt-20">CHAMPIONS LEAGUE FANTASY</h5>
								<p class="fz-13 lh-25 mt-15">Sed ut perspiciatis unde  natus error voluptase accusantium doloremque explicab wanted they survive as soldiers of fortune....</p>
								<div class="mt-30">
									<a href="#" class="btn-y-outline-lg work-sans fz-12">Read More</a>
								</div>
							</div>
						</div>
                    </div>
                </div>
            </div>
        </section>
        <section class="pt-150 tp-container top-product">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 text-center">
                        <h1 class="text-uppercase ls-3 bb white"><span class="yellow"> Top</span> Products</h1>
                        <p class="mt-50 fz-15 white">
                            The Promises something everyone Today still wanted they survive as soldiers of fortune.
                        </p>
                    </div>
                </div>
                <div class="row">
                    <div class="tp-slider mt-40">
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-1.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-2.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-3.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-4.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-1.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-2.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-3.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-4.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-1.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-2.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-3.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="tp-inner white-bg">
                                <img class="img-responsive" src="img/tp-4.png" alt="">
                                <div class="tp-inner-content">
                                    <h6 class="fz-13 green">Soccer Jerseys</h6>
                                    <span class="work-sans fz-18 gray-de display-ib mt-15 text-semi-bold">$ 95.66</span>
                                    <div class="mt-20">
                                        <a href="#" class="btn-round work-sans fz-11 gray-de text-uppercase text-semi-bold">ADD TO CART</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="pt-150 gray-f8f8-bg testimonials">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 text-center">
                        <h1 class="text-uppercase ls-3 bb">Words From <span class="yellow"> our Client</span></h1>
                        <p class="mt-50 fz-15">The Love Boat soon will be making another run the Love Boat promises something <br> everyone Today still wanted they survive as soldiers of fortune.</p>
                    </div>
                </div>
                <div class="row">
                    <div class="clients-slider mt-45">
                        <div class="item">
                            <img src="img/client-1.png" alt="" class="img-responsive pull-left">
                            <div class="pull-right clients-words">
                                <h6 class="work-sans fz-13 gray-de text-medium text-uppercase mt-10">LUCK WALKER</h6>
                                <p class="mt-10">A shadowy flight into the dangerous worlds of a mans who does not exist We're gonna do it.  On your marks get to set  gonna is make know our torturewatch the show.”</p>
                                <img src="img/sign.png" alt="" class="sign pull-right img-responsive">
                                <h6 class="des work-sans fz-12 text-medium text-right">Front End Developer</h6>
                            </div>
                        </div>
                        <div class="item">
                            <img src="img/client-2.png" alt="" class="img-responsive pull-left">
                            <div class="pull-right clients-words">
                                <h6 class="work-sans fz-13 gray-de text-medium text-uppercase mt-10">Stevan Smith</h6>
                                <p class="mt-10">A shadowy flight into the dangerous worlds of a mans who does not exist We're gonna do it.  On your marks get to set  gonna is make know our torturewatch the show.”</p>
                                <img src="img/sign.png" alt="" class="sign pull-right img-responsive">
                                <h6 class="des work-sans fz-12 text-medium text-right">Front End Developer</h6>
                            </div>
                        </div>
                        <div class="item">
                            <img src="img/client-1.png" alt="" class="img-responsive pull-left">
                            <div class="pull-right clients-words">
                                <h6 class="work-sans fz-13 gray-de text-medium text-uppercase mt-10">LUCK WALKER</h6>
                                <p class="mt-10">A shadowy flight into the dangerous worlds of a mans who does not exist We're gonna do it.  On your marks get to set  gonna is make know our torturewatch the show.”</p>
                                <img src="img/sign.png" alt="" class="sign pull-right img-responsive">
                                <h6 class="des work-sans fz-12 text-medium text-right">Front End Developer</h6>
                            </div>
                        </div>
                        <div class="item">
                            <img src="img/client-2.png" alt="" class="img-responsive pull-left">
                            <div class="pull-right clients-words">
                                <h6 class="work-sans fz-13 gray-de text-medium text-uppercase mt-10">Stevan Smith</h6>
                                <p class="mt-10">A shadowy flight into the dangerous worlds of a mans who does not exist We're gonna do it.  On your marks get to set  gonna is make know our torturewatch the show.”</p>
                                <img src="img/sign.png" alt="" class="sign pull-right img-responsive">
                                <h6 class="des work-sans fz-12 text-medium text-right">Front End Developer</h6>
                            </div>
                        </div>
                        <div class="item">
                            <img src="img/client-1.png" alt="" class="img-responsive pull-left">
                            <div class="pull-right clients-words">
                                <h6 class="work-sans fz-13 gray-de text-medium text-uppercase mt-10">LUCK WALKER</h6>
                                <p class="mt-10">A shadowy flight into the dangerous worlds of a mans who does not exist We're gonna do it.  On your marks get to set  gonna is make know our torturewatch the show.”</p>
                                <img src="img/sign.png" alt="" class="sign pull-right img-responsive">
                                <h6 class="des work-sans fz-12 text-medium text-right">Front End Developer</h6>
                            </div>
                        </div>
                        <div class="item">
                            <img src="img/client-2.png" alt="" class="img-responsive pull-left">
                            <div class="pull-right clients-words">
                                <h6 class="work-sans fz-13 gray-de text-medium text-uppercase mt-10">Stevan Smith</h6>
                                <p class="mt-10">A shadowy flight into the dangerous worlds of a mans who does not exist We're gonna do it.  On your marks get to set  gonna is make know our torturewatch the show.”</p>
                                <img src="img/sign.png" alt="" class="sign pull-right img-responsive">
                                <h6 class="des work-sans fz-12 text-medium text-right">Front End Developer</h6>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <div class="sponsors">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
						<div class="partners-carousel">
							<a href="#"><img src="img/s1.png" alt=""></a>
							<a href="#"><img src="img/s2.png" alt=""></a>
							<a href="#"><img src="img/s3.png" alt=""></a>
							<a href="#"><img src="img/s4.png" alt=""></a>
							<a href="#"><img src="img/s5.png" alt=""></a>
							<a href="#"><img src="img/s1.png" alt=""></a>
						</div>
                    </div>
                </div>
            </div>
        </div>
        <footer>
            <div class="upper-footer">
                <div class="container">
                    <div class="row">
                        <div class="col-md-4 col-sm-6">
                            <h5 class="raleway fz-14 gray-ccc text-bold fbb text-uppercase">About Us</h5>
                            <p class="mt-45 gray-999 fz-13">Aoluptas sit aspernatur aut odit aut fugit, sed elits quias consequuntur magni dolores eos qui ratione volust  luptatem sequi nesciunt. .</p>
                            <div class="f-social mt-35">
                                <ul class="list-inline">
                                    <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-google-plus"></i></a></li>
                                    <li><a href="#"><i class="fa fa-instagram"></i></a></li>
                                    <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-md-1 col-sm-2">
                            <h5 class="raleway fz-14 gray-ccc text-bold fbb text-uppercase">Links</h5>
                            <ul class="mt-45 iist-unstyled links">
                                <li><a href="#">Home</a></li>
                                <li><a href="#">About us</a></li>
                                <li><a href="#">Services</a></li>
                                <li><a href="#">Portfolio</a></li>
                                <li><a href="#">li-img</a></li>
                                <li><a href="#">Contact</a></li>
                            </ul>
                        </div>
                        <div class="col-md-3 col-sm-4">
                            <h5 class="raleway fz-14 gray-ccc text-bold fbb text-uppercase">Keep In touch</h5>
                            <div class="f-contact-info clearfix mt-45">
                                <img src="img/address.png" alt="" class="pull-left">
                                <span class="work-sans text-medium fz-13 gray-999 lh-24 pull-left">Address : 44 New Design Street,<br> Melbourne 005</span>
                            </div>
                            <div class="f-contact-info clearfix mt-25">
                                <img src="img/phone.png" alt="" class="pull-left">
                                <span class="work-sans text-medium fz-13 gray-999 lh-24 pull-left">Phone : (01) 800 433 633</span>
                            </div>
                            <div class="f-contact-info clearfix mt-25">
                                <img src="img/envelope.png" alt="" class="pull-left">
                                <span class="work-sans text-medium fz-13 gray-999 lh-24 pull-left">Email : info@anous.com</span>
                            </div>
                            <div class="f-contact-info clearfix mt-25">
                                <img src="img/fax.png" alt="" class="pull-left">
                                <span class="work-sans text-medium fz-13 gray-999 lh-24 pull-left">Fax : (01) 800 854 633</span>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <h5 class="raleway fz-14 gray-ccc text-bold fbb text-uppercase">instagram feed</h5>
                            <div class="instagram-links mt-45">
                                <a href="#"><img src="img/f1.jpg" alt=""></a>
                                <a href="#"><img src="img/f2.jpg" alt=""></a>
                                <a href="#"><img src="img/f3.jpg" alt=""></a>
                                <a href="#"><img src="img/f4.jpg" alt=""></a>
                                <a href="#"><img src="img/f5.jpg" alt=""></a>
                                <a href="#"><img src="img/f6.jpg" alt=""></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="lower-footer">
                <div class="container">
                    <div class="row">
                        <div class="col-md-6">
                        <div class="row">
                            <div class="col-md-3 col-sm-6">
                                <h4 class="white text-uppercase lh-90">Last <span class="yellow">Match</span></h4>
                            </div>
                            <div class="col-sm-6 last-match">
                                <span class="work-sans fz-14 text-bold white text-uppercase lh-90"><img src="img/f-team1.png" alt=""> AUTE</span>
                                <h4 class="lh-90 yellow text-bold display-ib">1:2</h4>
                                <span class="work-sans fz-14 text-bold white text-uppercase lh-90"><img src="img/f-team2.png" alt=""> Dolor</span>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <h4 class="work-sans fz-16 text-medium text-uppercase white lh-90 display-ib">News <span class="yellow"> Letters</span></h4>
                        <div class="input-group">
                          <input type="email" class="form-control" placeholder="Email">
                          <div class="input-group-addon"><a class="work-sans text-semi-bold fz-11 white text-uppercase" href="#">Subscribe</a></div>
                        </div>
                    </div>
                    </div>
                </div>
            </div>
            <div class="copy-rights">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12 text-center">
                            <p class="raleway text-semi-bold fz-12 gray-ccc ls-1">Copyrights&copy; 2015 All Rights Reserved.</p>
                        </div>
                    </div>
                </div>
            </div>
        </footer>
        <script src="js/jquery-1.12.4.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/owl.carousel.js"></script>
        <script src="js/jquery.countdown.min.js"></script>
        <script src="js/imagesloaded.pkgd.min.js"></script>
        <script src="js/isotope.pkgd.min.js"></script>
        <script src="js/main.js"></script>



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


热门标签: 行业 企业 公司 工厂 分类 响应式 自适应 设备 风格 颜色 bootstrap bootstrap自适应 bootstrap响应式 电商 网店 商城 欧美风 欧美 欧洲 美洲 pc+wap 移动+电脑 手机+电脑 黄色 宽屏 全屏 满屏 体育 体育信息

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

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

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