橙色欧风格的电竞游戏工作室整站网站源码下载



69 273 92



模板描述:橙色欧风格 电竞游戏 工作室,橙色欧风格的电竞游戏工作室整站网站源码下载html模板下载

代码结构

1. 引入CSS

<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/responsive.css" rel="stylesheet">

2. 引入JS

<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<script src="js/respond.js"></script>
<script src="js/jquery.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/jquery.fancybox.js"></script>
<script src="js/owl.js"></script>
<script src="js/appear.js"></script>
<script src="js/wow.js"></script>
<script src="js/scrollbar.js"></script>
<script src="js/script.js"></script>

3. HTML代码

<div class="page-wrapper">
    <!-- Preloader -->
    <div class="preloader"><div class="icon"></div></div>
    <!-- Main Header -->
    <header class="main-header header-style-one">
        <div class="header-container">
            <!--Header Background Shape-->
            <div class="bg-shape-box"><div class="bg-shape"></div></div>
            <!-- Header Top -->
            <div class="header-top">
				<div class="inner clearfix">
                    <div class="top-left">
                        <div class="top-text">Welcome to game developement studio</div>
                    </div>
                    <div class="top-right">
                        <ul class="info clearfix">
                            <li><a href="tel:666-888-0000">666 888 0000</a></li>
                            <li><a href="mailto:needhelp@sintix.com">needhelp@sintix.com</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- Header Upper -->
            <div class="header-upper">
                <div class="inner-container clearfix">
                    <!--Logo-->
                    <div class="logo-box">
                        <div class="logo"><a href="index.html" title="Sintix - Digital Video Gaming and Consol HTML Template"><img src="images/logo.png" alt="Sintix - Digital Video Gaming and Consol HTML Template" title="Sintix - Digital Video Gaming and Consol HTML Template"></a></div>
                    </div>
                    <!--Nav Box-->
                    <div class="nav-outer clearfix">
                        <!--Mobile Navigation Toggler-->
                        <div class="mobile-nav-toggler"><span class="icon flaticon-menu-2"></span></div>
                        <!-- Main Menu -->
                        <nav class="main-menu navbar-expand-md navbar-light">
                            <div class="collapse navbar-collapse show clearfix" id="navbarSupportedContent">
                                <ul class="navigation clearfix">
                                    <li class="current dropdown"><a href="index.html">Home</a>
                                        <ul>
                                            <li><a href="index.html">Home Page 01</a></li>
                                            <li><a href="index-2.html">Home Page 02</a></li>
                                            <li><a href="index-3.html">Home Page Light</a></li>
                                            <li class="dropdown"><a href="index.html">Header Styles</a>
                                                <ul>
                                                    <li><a href="index.html">Header Type 01</a></li>
                                                    <li><a href="index-2.html">Header Type 02</a></li>
                                                    <li><a href="index-3.html">Header Type 03</a></li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </li>
									<li class="dropdown"><a href="about.html">About</a>
                                        <ul>
                                            <li><a href="about.html">About Us</a></li>
                                            <li><a href="team.html">Our Team</a></li>
                                        </ul>
                                    </li>
                                    <li class="dropdown"><a href="games.html">Games</a>
                                        <ul>
                                            <li><a href="games.html">All Games</a></li>
                                            <li><a href="game-details.html">Dragon Fight</a></li>
                                            <li><a href="game-details.html">Street Fighter</a></li>
                                            <li><a href="game-details.html">Justice League</a></li>
                                            <li><a href="game-details.html">The Mob Rules</a></li>
                                            <li><a href="game-details.html">Mafia Mystrey</a></li>
                                        </ul>
                                    </li>
                                    <li><a href="gallery.html">Gallery</a></li>
                                    <li class="dropdown"><a href="blog.html">Blog</a>
                                       <ul>
                                            <li><a href="blog.html">Blog Sidebar</a></li>
                                            <li><a href="blog-grid.html">Blog Grid View</a></li>
                                            <li><a href="blog-single.html">Blog Single</a></li>
                                        </ul>
                                    </li>
                                    <li><a href="contact.html">Contact</a></li>
                                </ul>
                            </div>
                        </nav>
                        <!-- Main Menu End-->
                        <ul class="social-links clearfix">
                            <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                            <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                            <li><a href="#"><span class="fab fa-linkedin-in"></span></a></li>
                            <li><a href="#"><span class="fab fa-pinterest-p"></span></a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <!--End Header Upper-->
        </div><!--End Header Container-->
        <!-- Sticky Header  -->
        <div class="sticky-header">
            <div class="auto-container clearfix">
                <!--Logo-->
                <div class="logo pull-left">
                    <a href="index.html" title=""><img src="images/sticky-logo.png" alt="" title=""></a>
                </div>
                <!--Right Col-->
                <div class="pull-right">
                    <!-- Main Menu -->
                    <nav class="main-menu clearfix">
                        <!--Keep This Empty / Menu will come through Javascript-->
                    </nav><!-- Main Menu End-->
                </div>
            </div>
        </div><!-- End Sticky Menu -->
        <!-- Mobile Menu  -->
        <div class="mobile-menu">
            <div class="menu-backdrop"></div>
            <div class="close-btn"><span class="icon flaticon-cancel"></span></div>
            <nav class="menu-box">
                <div class="nav-logo"><a href="index.html"><img src="images/logo.png" alt="" title=""></a></div>
                <div class="menu-outer"><!--Here Menu Will Come Automatically Via Javascript / Same Menu as in Header--></div>
                <!--Social Links-->
                <div class="social-links">
                    <ul class="clearfix">
                        <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                        <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                        <li><a href="#"><span class="fab fa-pinterest-p"></span></a></li>
                        <li><a href="#"><span class="fab fa-instagram"></span></a></li>
                        <li><a href="#"><span class="fab fa-youtube"></span></a></li>
                    </ul>
                </div>
            </nav>
        </div><!-- End Mobile Menu -->
    </header>
    <!-- End Main Header -->
    <!-- Banner Section -->
    <section class="banner-section">
        <div class="banner-carousel owl-theme owl-carousel">
            <!-- Slide Item -->
            <div class="slide-item">
            	<div class="image-layer" style="background-image:url(images/main-slider/1.jpg)"></div>
                <div class="auto-container">
                    <div class="content-box">
                        <div class="content">
                            <h2>Welcome to sintix Games Studio!</h2>
                            <div class="link-box"><a href="games.html" class="theme-btn btn-style-one"><span class="btn-title">Our games</span></a></div>
                        </div>
                    </div>  
                </div>
            </div>
            <!-- Slide Item -->
            <div class="slide-item">
                <div class="image-layer" style="background-image:url(images/main-slider/1-a.jpg)"></div>
                <div class="auto-container">
                    <div class="content-box">
                        <div class="content">
                            <h2>Welcome to sintix Games Studio!</h2>
                            <div class="link-box"><a href="games.html" class="theme-btn btn-style-one"><span class="btn-title">Our games</span></a></div>
                        </div>
                    </div>  
                </div>
            </div>
            <!-- Slide Item -->
            <div class="slide-item">
                <div class="image-layer" style="background-image:url(images/main-slider/1-b.jpg)"></div>
                <div class="auto-container">
                    <div class="content-box">
                        <div class="content">
                            <h2>Welcome to sintix Games Studio!</h2>
                            <div class="link-box"><a href="games.html" class="theme-btn btn-style-one"><span class="btn-title">Our games</span></a></div>
                        </div>
                    </div>  
                </div>
            </div>
        </div>
    </section>
    <!--End Banner Section -->
	<!--Games Section-->
    <section class="games-section">
        <div class="top-pattern-layer"></div>
        <div class="bottom-pattern-layer"></div>
        <div class="auto-container">
            <!--Title-->
            <div class="sec-title centered"><h2>Latest games</h2><span class="bottom-curve"></span></div>
        	<div class="row clearfix">
            	<!--Game Block-->
                <div class="game-block col-lg-4 col-md-6 col-sm-12 wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
                	<div class="inner-box">
                    	<div class="image-box">
                            <figure class="image"><a href="game-details.html"><img src="images/resource/game-image-1.jpg" alt="" title=""></a></figure>
                            <div class="link-box"><a href="#" class="link-btn"> <span class="btn-title">Download game</span></a></div>
                        </div>
                        <div class="lower-content">
                            <div class="rating">Rating <span class="ratings"><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span></span></div>
                            <h3><a href="game-details.html">Dragon Fight</a></h3>
                            <div class="text">Lorem ipsum is simply free text used by copytyping refreshing.</div>
                            <div class="post-info">
                                <ul class="clearfix">
                                    <li><a href="#"><span class="icon flaticon-calendar-2"></span>May 2018</a></li>
                                    <li><a href="#"><span class="icon flaticon-console"></span>Ps4</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <!--Game Block-->
                <div class="game-block col-lg-4 col-md-6 col-sm-12 wow fadeInUp" data-wow-delay="300ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <div class="image-box">
                            <figure class="image"><a href="game-details.html"><img src="images/resource/game-image-2.jpg" alt="" title=""></a></figure>
                            <div class="link-box"><a href="#" class="link-btn"> <span class="btn-title">Download game</span></a></div>
                        </div>
                        <div class="lower-content">
                            <div class="rating">Rating <span class="ratings"><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span></span></div>
                            <h3><a href="game-details.html">Street fighter</a></h3>
                            <div class="text">Lorem ipsum is simply free text used by copytyping refreshing.</div>
                            <div class="post-info">
                                <ul class="clearfix">
                                    <li><a href="#"><span class="icon flaticon-calendar-2"></span>May 2018</a></li>
                                    <li><a href="#"><span class="icon flaticon-console"></span>Ps4</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <!--Game Block-->
                <div class="game-block col-lg-4 col-md-6 col-sm-12 wow fadeInUp" data-wow-delay="600ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <div class="image-box">
                            <figure class="image"><a href="game-details.html"><img src="images/resource/game-image-3.jpg" alt="" title=""></a></figure>
                            <div class="link-box"><a href="#" class="link-btn"> <span class="btn-title">Download game</span></a></div>
                        </div>
                        <div class="lower-content">
                            <div class="rating">Rating <span class="ratings"><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span></span></div>
                            <h3><a href="game-details.html">Justice League</a></h3>
                            <div class="text">Lorem ipsum is simply free text used by copytyping refreshing.</div>
                            <div class="post-info">
                                <ul class="clearfix">
                                    <li><a href="#"><span class="icon flaticon-calendar-2"></span>May 2018</a></li>
                                    <li><a href="#"><span class="icon flaticon-console"></span>Ps4</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--Sponsors Section-->
    <section class="sponsors-section">
        <div class="auto-container">
            <div class="sponsors-outer">
                <!--Sponsors Carousel-->
                <ul class="sponsors-carousel owl-carousel owl-theme">
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/1.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/2.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/3.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/1.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/2.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/3.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/1.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/2.png" alt=""></a></figure></li>
                    <li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/3.png" alt=""></a></figure></li>
                </ul>
            </div>
        </div>
    </section>
    <!--End Sponsors Section-->
    <!--Dual Section-->
    <section class="dual-section">
        <div class="top-pattern-layer"></div>
        <div class="home-gallery">
            <div class="auto-container">
                <!--Title-->
                <div class="sec-title centered"><h2>Our gallery</h2><span class="bottom-curve"></span></div>
                <div class="fixed-gallery-box clearfix">
                    <!--Gallery Item-->
                    <div class="gallery-item wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
                        <div class="inner-box">
                            <div class="image-box">
                                <div class="image-layer" style="background-image: url(images/gallery/1.jpg);"></div>
                            </div>
                            <div class="hover-box">
                                <a href="images/gallery/1.jpg" title="" data-fancybox="home-gallery" class="lightbox-image"><span class="icon flaticon-cross"></span></a>
                            </div>
                        </div>
                    </div>
                    <!--Gallery Item-->
                    <div class="gallery-item wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
                        <div class="inner-box">
                            <div class="image-box">
                                <div class="image-layer" style="background-image: url(images/gallery/2.jpg);"></div>
                            </div>
                            <div class="hover-box">
                                <a href="images/gallery/2.jpg" title="" data-fancybox="home-gallery" class="lightbox-image"><span class="icon flaticon-cross"></span></a>
                            </div>
                        </div>
                    </div>
                    <!--Gallery Item-->
                    <div class="gallery-item wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
                        <div class="inner-box">
                            <div class="image-box">
                                <div class="image-layer" style="background-image: url(images/gallery/3.jpg);"></div>
                            </div>
                            <div class="hover-box">
                                <a href="images/gallery/3.jpg" title="" data-fancybox="home-gallery" class="lightbox-image"><span class="icon flaticon-cross"></span></a>
                            </div>
                        </div>
                    </div>
                    <!--Gallery Item-->
                    <div class="gallery-item wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
                        <div class="inner-box">
                            <div class="image-box">
                                <div class="image-layer" style="background-image: url(images/gallery/4.jpg);"></div>
                            </div>
                            <div class="hover-box">
                                <a href="images/gallery/4.jpg" title="" data-fancybox="home-gallery" class="lightbox-image"><span class="icon flaticon-cross"></span></a>
                            </div>
                        </div>
                    </div>
                    <!--Gallery Item-->
                    <div class="gallery-item wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
                        <div class="inner-box">
                            <div class="image-box">
                                <div class="image-layer" style="background-image: url(images/gallery/5.jpg);"></div>
                            </div>
                            <div class="hover-box">
                                <a href="images/gallery/5.jpg" title="" data-fancybox="home-gallery" class="lightbox-image"><span class="icon flaticon-cross"></span></a>
                            </div>
                        </div>
                    </div>
                    <!--Gallery Item-->
                    <div class="gallery-item wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
                        <div class="inner-box">
                            <div class="image-box">
                                <div class="image-layer" style="background-image: url(images/gallery/6.jpg);"></div>
                            </div>
                            <div class="hover-box">
                                <a href="images/gallery/6.jpg" title="" data-fancybox="home-gallery" class="lightbox-image"><span class="icon flaticon-cross"></span></a>
                            </div>
                        </div>
                    </div>
                    <!--Gallery Item-->
                    <div class="gallery-item wow fadeInDown" data-wow-delay="0ms" data-wow-duration="1500ms">
                        <div class="inner-box">
                            <div class="image-box">
                                <div class="image-layer" style="background-image: url(images/gallery/7.jpg);"></div>
                            </div>
                            <div class="hover-box">
                                <a href="images/gallery/7.jpg" title="" data-fancybox="home-gallery" class="lightbox-image"><span class="icon flaticon-cross"></span></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="fact-counter">
            <div class="auto-container">
                <!--Title-->
                <div class="sec-title centered"><h2>Numbers speaks</h2><span class="bottom-curve"></span></div>
                <div class="row clearfix">
                    <!--Column-->
                    <div class="counter-column col-lg-3 col-md-6 col-sm-12 wow fadeInUp">
                        <div class="count-box"><span class="count-text" data-speed="3000" data-stop="84">0</span></div>
                        <h4 class="counter-title">Games developed</h4>
                    </div>
                    <!--Column-->
                    <div class="counter-column col-lg-3 col-md-6 col-sm-12 wow fadeInUp" data-wow-delay="400ms">
                        <div class="count-box">0<span class="count-text" data-speed="1500" data-stop="07">0</span></div>
                        <h4 class="counter-title">years of experience</h4>
                    </div>
                    <!--Column-->
                    <div class="counter-column col-lg-3 col-md-6 col-sm-12 wow fadeInUp" data-wow-delay="800ms">
                        <div class="count-box"><span class="count-text" data-speed="1500" data-stop="16">0</span></div>
                        <h4 class="counter-title">team members</h4>
                    </div>
                    <!--Column-->
                    <div class="counter-column col-lg-3 col-md-6 col-sm-12 wow fadeInUp" data-wow-delay="1200ms">
                        <div class="count-box"><span class="count-text" data-speed="3000" data-stop="99">0</span></div>
                        <h4 class="counter-title">positive ratings</h4>
                    </div>
                </div>
            </div>
        </div>
        <div class="bg-image-layer" style="background-image: url(images/background/fact-counter-bg.png);"></div>
    </section>
    <!--Reviews Section-->
    <section class="reviews-section">
        <div class="top-pattern-layer-dark"></div>
        <div class="bottom-pattern-layer-dark"></div>
        <div class="auto-container">
            <!--Title-->
            <div class="sec-title"><h2>Players reviews</h2><span class="bottom-curve"></span></div>
            <div class="testimonial-slider carousel-outer clearfix">
                <div class="thumb-carousel-box">
                    <ul class="thumb-carousel owl-carousel owl-theme">
                        <li class="thumb"><img src="images/resource/rev-thumb-1.jpg" alt=""></li>
                        <li class="thumb"><img src="images/resource/rev-thumb-2.jpg" alt=""></li>
                        <li class="thumb"><img src="images/resource/rev-thumb-3.jpg" alt=""></li>
                        <li class="thumb"><img src="images/resource/rev-thumb-1.jpg" alt=""></li>
                        <li class="thumb"><img src="images/resource/rev-thumb-2.jpg" alt=""></li>
                        <li class="thumb"><img src="images/resource/rev-thumb-3.jpg" alt=""></li>
                    </ul>
                </div>
                <div class="text-carousel owl-carousel owl-theme">
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="inner">
                            <div class="text">This is due to their excellent service competitive pricing and customer support. It’s throughly refresing to get such a personal touch. There are many variations of passages of available, but the majority have suffered alteration in some form by injected humour.</div>
                            <div class="info clearfix"><span class="name">Jessica brown</span> &ensp;-&ensp; <span class="date">25 may, 2019</span></div>
                        </div>
                    </div>
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="inner">
                            <div class="text">This is due to their excellent service competitive pricing and customer support. It’s throughly refresing to get such a personal touch. There are many variations of passages of available, but the majority have suffered alteration in some form by injected humour.</div>
                            <div class="info clearfix"><span class="name">Kevin Smith</span> &ensp;-&ensp; <span class="date">25 may, 2019</span></div>
                        </div>
                    </div>
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="inner">
                            <div class="text">This is due to their excellent service competitive pricing and customer support. It’s throughly refresing to get such a personal touch. There are many variations of passages of available, but the majority have suffered alteration in some form by injected humour.</div>
                            <div class="info clearfix"><span class="name">Christine eve</span> &ensp;-&ensp; <span class="date">25 may, 2019</span></div>
                        </div>
                    </div>
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="inner">
                            <div class="text">This is due to their excellent service competitive pricing and customer support. It’s throughly refresing to get such a personal touch. There are many variations of passages of available, but the majority have suffered alteration in some form by injected humour.</div>
                            <div class="info clearfix"><span class="name">Jessica brown</span> &ensp;-&ensp; <span class="date">25 may, 2019</span></div>
                        </div>
                    </div>
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="inner">
                            <div class="text">This is due to their excellent service competitive pricing and customer support. It’s throughly refresing to get such a personal touch. There are many variations of passages of available, but the majority have suffered alteration in some form by injected humour.</div>
                            <div class="info clearfix"><span class="name">Kevin Smith</span> &ensp;-&ensp; <span class="date">25 may, 2019</span></div>
                        </div>
                    </div>
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="inner">
                            <div class="text">This is due to their excellent service competitive pricing and customer support. It’s throughly refresing to get such a personal touch. There are many variations of passages of available, but the majority have suffered alteration in some form by injected humour.</div>
                            <div class="info clearfix"><span class="name">Christine eve</span> &ensp;-&ensp; <span class="date">25 may, 2019</span></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--Video Section-->
    <section class="video-section">
        <div class="image-layer" style="background-image: url(images/background/video-bg.jpg);"></div>
        <div class="auto-container">
            <div class="content-box wow zoomInStable" data-wow-delay="0ms" data-wow-duration="2500ms">
                <div class="link-box">
                    <a href="http://www.51qianduan.com//watch?v=ticp6ScuyLY" class="lightbox-image"><span class="icon fa fa-play"></span></a>
                </div>
                <h2>Sintix WHERE DIGITAL WORLDS MEET REAL INNOVATION</h2>
            </div>
        </div>
    </section>
    <!--Featured Games Section-->
    <section class="featured-games-section">
        <div class="top-pattern-layer"></div>
        <div class="auto-container">
            <div class="sec-title centered"><h2>Featured Games</h2><span class="bottom-curve"></span></div>
            <div class="featured-carousel-box">
                <div class="featured-game-carousel single-item-carousel owl-theme owl-carousel">
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="content-box clearfix">
                            <!--Image Column-->
                            <div class="image-column">
                                <div class="inner">
                                    <div class="image-layer" style="background-image: url(images/resource/featured-image-1.jpg);"></div>
                                    <div class="image-box"><img src="images/resource/featured-image-1.jpg" alt="" title=""></div>
                                    <a href="game-details.html" class="over-link"></a>
                                </div>
                            </div>
                            <!--Text Column-->
                            <div class="text-column">
                                <div class="inner">
                                    <div class="title clearfix">
                                        <h3><a href="game-details.html">Dragon Fight 2</a> </h3>
                                        <div class="rating"><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span></div>
                                    </div>
                                    <div class="info">
                                        <ul class="clearfix">
                                            <li><a href="#"><span class="icon flaticon-calendar-2"></span>May 2018</a></li>
                                            <li><a href="#"><span class="icon flaticon-console"></span>Google Play</a></li>
                                        </ul>
                                    </div>
                                    <div class="text">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</div>
                                    <div class="link-box"><a href="games.html" class="theme-btn btn-style-one"><span class="btn-title">Download game</span></a></div>
                                    <ul class="bottom-links clearfix">
                                        <li><a href="games.html" class="theme-btn">More About this</a></li>
                                        <li><a href="games.html" class="theme-btn">See All Games</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Slide Item-->
                    <div class="slide-item">
                        <div class="content-box clearfix">
                            <!--Image Column-->
                            <div class="image-column">
                                <div class="inner">
                                    <div class="image-layer" style="background-image: url(images/resource/featured-image-1.jpg);"></div>
                                    <div class="image-box"><img src="images/resource/featured-image-1.jpg" alt="" title=""></div>
                                    <a href="game-details.html" class="over-link"></a>
                                </div>
                            </div>
                            <!--Text Column-->
                            <div class="text-column">
                                <div class="inner">
                                    <div class="title clearfix">
                                        <h3><a href="game-details.html">justic league</a> </h3>
                                        <div class="rating"><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span></div>
                                    </div>
                                    <div class="info">
                                        <ul class="clearfix">
                                            <li><a href="#"><span class="icon flaticon-calendar-2"></span>May 2018</a></li>
                                            <li><a href="#"><span class="icon flaticon-console"></span>Google Play</a></li>
                                        </ul>
                                    </div>
                                    <div class="text">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</div>
                                    <div class="link-box"><a href="games.html" class="theme-btn btn-style-one"><span class="btn-title">Download game</span></a></div>
                                    <ul class="bottom-links clearfix">
                                        <li><a href="games.html" class="theme-btn">More About this</a></li>
                                        <li><a href="games.html" class="theme-btn">See All Games</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--Team Section-->
    <section class="team-section">
        <div class="top-pattern-layer-dark"></div>
        <div class="bottom-pattern-layer-dark"></div>
        <div class="auto-container">
            <!--Title-->
            <div class="sec-title centered"><h2>Our team</h2><span class="bottom-curve"></span></div>
            <div class="row clearfix">
                <!--Team Block-->
                <div class="team-block col-lg-3 col-md-6 col-sm-12 wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="#"><img src="images/resource/team-1.jpg" alt="" title=""></a></figure>
                        <div class="lower-box">
                            <h3><a href="#">Jessica Brown</a></h3>
                            <div class="designation">Manager</div>
                            <div class="social-links">
                                <ul class="default-social-links clearfix">
                                    <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                                    <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                                    <li><a href="#"><span class="fab fa-instagram"></span></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <!--Team Block-->
                <div class="team-block col-lg-3 col-md-6 col-sm-12 wow fadeInLeft" data-wow-delay="300ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="#"><img src="images/resource/team-2.jpg" alt="" title=""></a></figure>
                        <div class="lower-box">
                            <h3><a href="#">Kevin Smith</a></h3>
                            <div class="designation">Developer</div>
                            <div class="social-links">
                                <ul class="default-social-links clearfix">
                                    <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                                    <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                                    <li><a href="#"><span class="fab fa-instagram"></span></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <!--Team Block-->
                <div class="team-block col-lg-3 col-md-6 col-sm-12 wow fadeInLeft" data-wow-delay="600ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="#"><img src="images/resource/team-3.jpg" alt="" title=""></a></figure>
                        <div class="lower-box">
                            <h3><a href="#">Christine eve</a></h3>
                            <div class="designation">Editor</div>
                            <div class="social-links">
                                <ul class="default-social-links clearfix">
                                    <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                                    <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                                    <li><a href="#"><span class="fab fa-instagram"></span></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <!--Team Block-->
                <div class="team-block col-lg-3 col-md-6 col-sm-12 wow fadeInLeft" data-wow-delay="900ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="#"><img src="images/resource/team-4.jpg" alt="" title=""></a></figure>
                        <div class="lower-box">
                            <h3><a href="#">Mike hardson</a></h3>
                            <div class="designation">Designer</div>
                            <div class="social-links">
                                <ul class="default-social-links clearfix">
                                    <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                                    <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                                    <li><a href="#"><span class="fab fa-instagram"></span></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--News Section-->
    <section class="news-section">
        <div class="auto-container">
            <!--Title-->
            <div class="sec-title centered"><h2>latest Blog Posts</h2><span class="bottom-curve"></span></div>
            <div class="row clearfix">
                <!--News Block-->
                <div class="news-block col-lg-6 col-md-6 col-sm-12 wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="blog-single.html"><img src="images/resource/news-image-1.jpg" alt="" title=""></a></figure>
                        <div class="over-box">
                            <div class="date"><span class="date-title">26 May, 2019</span></div>
                            <h3><a href="blog-single.html">esports games this weekend</a></h3>
                        </div>
                    </div>
                </div>
                <!--News Block-->
                <div class="news-block col-lg-6 col-md-6 col-sm-12 wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="blog-single.html"><img src="images/resource/news-image-2.jpg" alt="" title=""></a></figure>
                        <div class="over-box">
                            <div class="date"><span class="date-title">22 May, 2019</span></div>
                            <h3><a href="blog-single.html">Willkommen in sintix Eternal Foren</a></h3>
                        </div>
                    </div>
                </div>
                <!--News Block-->
                <div class="news-block col-lg-6 col-md-6 col-sm-12 wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="#"><img src="images/resource/news-image-3.jpg" alt="" title=""></a></figure>
                        <div class="over-box">
                            <div class="date"><span class="date-title">19 May, 2019</span></div>
                            <h3><a href="#">Concept art from sintix</a></h3>
                        </div>
                    </div>
                </div>
                <!--News Block-->
                <div class="news-block col-lg-6 col-md-6 col-sm-12 wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
                    <div class="inner-box">
                        <figure class="image-box"><a href="blog-single.html"><img src="images/resource/news-image-4.jpg" alt="" title=""></a></figure>
                        <div class="over-box">
                            <div class="date"><span class="date-title">18 May, 2019</span></div>
                            <h3><a href="blog-single.html">The slayer has entered the facility</a></h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- Main Footer -->
    <footer class="main-footer">
        <div class="top-pattern-layer-dark"></div>
        <div class="auto-container">
            <!--Widgets Section-->
            <div class="widgets-section">
                <div class="row clearfix">
                    <!--Column-->
                    <div class="column col-lg-4 col-md-6 col-sm-12">
                        <div class="footer-widget logo-widget">
                            <div class="widget-title">
                                    <h3>About us</h3>
                                </div>
                            <div class="text">There are many variations of passages of lorem ipsum is simply free text available but the majority have suffered alteration in some form by injected.</div>
							<!--Newsletter-->
							<div class="newsletter-form">
								<form method="post" action="contact.html">
									<div class="form-group clearfix">
										<input type="email" name="email" value="" placeholder="Email address" required>
										<button type="submit" class="theme-btn newsletter-btn"><span class="icon flaticon-arrows-6"></span></button>
									</div>
								</form>
							</div>
                        </div>
                    </div>
                    <!--Column-->
                    <div class="column col-lg-5 col-md-6 col-sm-12">
                        <div class="footer-widget links-widget">
                            <div class="widget-content">
                                <div class="row clearfix">
                                    <div class="column col-lg-6 col-md-6 col-sm-12">
                                        <div class="widget-title">
                                            <h3>Explore</h3>
                                        </div>
                                        <ul class="list">
                                            <li><a href="#">About</a></li>
                                            <li><a href="#">Our Games</a></li>
                                            <li><a href="#">Contact Us</a></li>
                                            <li><a href="#">Help & Support</a></li>
                                            <li><a href="#">Privacy Policy</a></li>
                                        </ul>
                                    </div>
                                    <div class="column col-lg-6 col-md-6 col-sm-12">
                                        <div class="widget-title">
                                            <h3>Our Games</h3>
                                        </div>
                                        <ul class="list">
                                            <li><a href="#">Need For Speed</a></li>
                                            <li><a href="#">Call Of Duty</a></li>
                                            <li><a href="#">Resident Evil</a></li>
                                            <li><a href="#">Dragons Fight</a></li>
                                            <li><a href="#">2 Player Champions</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>  
                        </div>
                    </div>
                    <!--Column-->
                    <div class="column col-lg-3 col-md-6 col-sm-12">
                        <div class="footer-widget info-widget">
                            <ul class="contact-info">
                                <li><strong>Phone</strong> <br><a href="tel:666-888-000">666 888 000</a></li>
                                <li><strong>Address</strong> <br>88 road, broklyn street <br>new york, usa</li>
                                <li><strong>Email Address</strong> <br><a href="mailto:needhelp@sintix.com">needhelp@sintix.com</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Footer Bottom -->
        <div class="footer-bottom">
            <div class="outer-container">
                <!--Footer Bottom Shape-->
                <div class="bottom-shape-box"><div class="bg-shape"></div></div>
                <div class="auto-container">
                    <!--Scroll to top-->
                    <div class="scroll-to-top scroll-to-target" data-target="html"><span class="flaticon-up-arrow"></span></div>
                    <!--Scroll to top-->
                    <div class="row clearfix">
                        <!-- Column -->
                        <div class="column col-lg-6 col-md-12 col-sm-12">
                            <div class="copyright"><span class="logo-icon"></span> &copy; Copyrights 2019 <a href="#">Sintix</a> - All Rights Reserved</div>
                        </div>
                        <!-- Column -->
                        <div class="column col-lg-6 col-md-12 col-sm-12">
                            <div class="social-links">
                                <ul class="default-social-links">
                                    <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                                    <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                                    <li><a href="#"><span class="fab fa-pinterest-p"></span></a></li>
                                    <li><a href="#"><span class="fab fa-instagram"></span></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
</div>
<!--End pagewrapper-->
<!--Scroll to top-->
<div class="scroll-to-top scroll-to-target" data-target="html"><span class="flaticon-up-arrow"></span></div>



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


热门标签: 扁平化 养生会馆 植物花草 游戏 黑色 bootstrap自适应 IT网络科技 蓝色 普通自适应 欧美风 旅游 红色 中国风 金融理财保险 绿色 韩系 高校 灰色 日系 简洁简约 工业产品 黄色 炫酷 家居装饰 紫色 卡通动画 橙色 招聘猎头 精美 实用通用 艺术创意 粉色 政府 婚庆 大气 白色 新闻资讯 婚纱摄影 棕色 清新 教育培训 彩色 绘画 设计 餐饮美食 其他风格 外贸 服装服饰 建筑 化工企业 医药器械 美容美发 动漫 电影视频 包装印刷 机械 汽车4S店 农业产品 咨询管理 酒店 健身房 化妆品 食品 花卉 房地产 协会组织 快递货运 数码电器 搬家 珠宝首饰 酒业 文化传媒 装修装饰 医院医疗 律师 酒吧音乐 图书 动物宠物 航空航天 股票 能源 公益 饮品 生活用品 家政保洁 体育 房屋租赁 商务 电力公司 打车租车 环保 宗教寺庙 工具文具 企业行业 自适应响应式 风格类型 颜色色彩

×
×
51前端

注册

官方QQ群
qq群

扫描上面二维码加微信群

官方QQ群

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

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