绿色欧美风格的在线学习教育整站网站源码下载



18 68 23



模板描述:绿色欧美风格 在线学习教育 整站网站,绿色欧美风格的在线学习教育整站网站源码下载html模板下载

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/fontawesome-all.min.css">
<link rel="stylesheet" href="css/aos.css">
<link rel="stylesheet" href="css/nice-select.css">
<link rel="stylesheet" href="css/meanmenu.css">
<link rel="stylesheet" href="css/slick.css">
<link rel="stylesheet" href="css/default.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">

2. 引入JS

<script src="js/vendor/jquery-1.12.4.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/isotope.pkgd.min.js"></script>
<script src="js/slick.min.js"></script>
<script src="js/jquery.meanmenu.min.js"></script>
<script src="js/ajax-form.js"></script>
<script src="js/wow.min.js"></script>
<script src="js/aos.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/jquery.counterup.min.js"></script>
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.scrollUp.min.js"></script>
<script src="js/imagesloaded.pkgd.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>

3. HTML代码

        <!-- preloader -->
        <div id="preloader">
            <div id="loading-center">
                <div id="loading-center-absolute">
                    <div class="object" id="object_one"></div>
                    <div class="object" id="object_two"></div>
                    <div class="object" id="object_three"></div>
                </div>
            </div>
        </div>
        <!-- preloader-end -->
        <!-- header -->
        <header>
            <div class="header-top-wrap d-none d-md-block">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-6 col-md-7">
                            <div class="header-top-menu">
                                <ul>
                                    <li><a href="#">About</a></li>
                                    <li><a href="#">Pricing</a></li>
                                    <li><a href="#">Blog</a></li>
                                    <li><a href="#">Support</a></li>
                                    <li><a href="#">Contact</a></li>
                                    <li><a href="#">Career</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-5">
                            <div class="header-sign-btn text-right">
                                <a href="#">Log In</a>
                                <a href="#">Sign Up</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="header-sticky" class="main-header-area">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-lg-3 col-md-4">
                            <div class="logo">
                                <a href="index.html"><img src="img/logo/logo.png" alt="logo"></a>
                            </div>
                        </div>
                        <div class="col-lg-5 col-md-6 d-none d-md-block">
                            <div class="header-search-bar">
                                <form action="#">
                                    <input type="text" placeholder="Search Courses ..">
                                    <button><i class="fas fa-search"></i></button>
                                </form>
                            </div>
                        </div>
                        <div class="col-lg-4 text-right d-none d-lg-block">
                            <div class="main-menu d-inline-block">
                                <nav id="mobile-menu">
                                    <ul>
                                        <li class="menu-item-has-children"><a href="#">Home</a>
                                            <ul class="submenu">
                                                <li><a href="index.html">Home Style One</a></li>
                                                <li><a href="index-2.html">Home Style Two</a></li>
                                                <li><a href="index-3.html">Home Style Three</a></li>
                                                <li><a href="index-4.html">Home Style Four</a></li>
                                                <li><a href="index-5.html">Home Style Five</a></li>
                                            </ul>
                                        </li>
                                        <li class="menu-item-has-children"><a href="#">Pages</a>
                                            <ul class="submenu">
                                                <li><a href="events.html">Our Events</a></li>
                                                <li><a href="event-details.html">Event Details</a></li>
                                                <li><a href="instructor.html">Instructor Page</a></li>
                                                <li><a href="instructor-single.html">Instructor Single</a></li>
                                                <li><a href="pricing.html">Pricing Plan</a></li>
                                                <li><a href="blog.html">Blog Page</a></li>
                                                <li><a href="blog-details.html">Blog Details</a></li>
                                                <li><a href="shop.html">Shop Page</a></li>
                                                <li><a href="shop-details.html">Shop Details</a></li>
                                                <li><a href="contact-us.html">Contact Page</a></li>
                                            </ul>
                                        </li>
                                        <li><a href="#">Courses</a>
                                            <ul class="submenu">
                                                <li><a href="our-courses.html">Our Courses</a></li>
                                                <li><a href="courses-details.html">Courses Details</a></li>
                                            </ul>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                            <div class="shop-cart-icon d-none d-xl-inline-block">
                                <a href="#"><img src="img/icon/shop_cart.png" alt="icon"></a>
                                <span>0</span>
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="mobile-menu"></div>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <!-- header-end -->
        <!-- main-area -->
        <main>
            <!-- slider-area -->
            <section class="slider-area slider-one-bg" data-background="img/slider/slider_bg01.jpg">
                <div class="container">
                    <div class="row">
                        <div class="col-xl-6 col-lg-7 col-md-10">
                            <div class="slider-content slider-content-p">
                                <h2 class="wow fadeInUp" data-wow-delay=".2s">Get skills from our top class courses</h2>
                                <p class="wow fadeInUp" data-wow-delay=".4s">Our on-demand videos and interactive code challenges are there for you when you need them.</p>
                                <a href="#" class="btn wow fadeInUp" data-wow-delay=".6s">Learn More</a>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- slider-area-end -->
            <!-- features-area -->
            <section class="features-area features-mt">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-4 col-md-6">
                            <div class="single-features mb-30">
                                <div class="features-top">
                                    <div class="features-icon">
                                        <img src="img/icon/features_icon01.png" alt="icon">
                                    </div>
                                    <h3>Expert Instructor</h3>
                                </div>
                                <div class="features-content">
                                    <p>Online learning program threat designed to prepare you.</p>
                                </div>
                                <div class="features-check"><i class="fas fa-check"></i></div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-md-6">
                            <div class="single-features mb-30">
                                <div class="features-top">
                                    <div class="features-icon">
                                        <img src="img/icon/features_icon02.png" alt="icon">
                                    </div>
                                    <h3>Unlimited Access</h3>
                                </div>
                                <div class="features-content">
                                    <p>Online learning program threat designed to prepare you.</p>
                                </div>
                                <div class="features-check"><i class="fas fa-check"></i></div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-md-6">
                            <div class="single-features mb-30">
                                <div class="features-top">
                                    <div class="features-icon">
                                        <img src="img/icon/features_icon03.png" alt="icon">
                                    </div>
                                    <h3>3,10,109 Courses</h3>
                                </div>
                                <div class="features-content">
                                    <p>Online learning program threat designed to prepare you.</p>
                                </div>
                                <div class="features-check"><i class="fas fa-check"></i></div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- features-area-end -->
            <!-- fact-area -->
            <section class="fact-area pt-105">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-xl-10">
                            <div class="fact-title text-center mb-60">
                                <h2>Online learning program that will prepare you for a career in the industry</h2>
                            </div>
                        </div>
                    </div>
                    <div class="row justify-content-around">
                        <div class="col-lg-3 col-md-4 col-sm-6">
                            <div class="single-fact-area text-center mb-50">
                                <h2><span class="count">50</span>k+</h2>
                                <span>Current Student</span>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-4 col-sm-6">
                            <div class="single-fact-area text-center mb-50">
                                <h2><span class="count">100</span>k+</h2>
                                <span>Special Courses</span>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-4 col-sm-6">
                            <div class="single-fact-area text-center mb-50">
                                <h2><span class="count">31</span>k+</h2>
                                <span>Successful Stories</span>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- fact-area-end -->
            <!-- learn-area -->
            <section class="learn-area p-relative pt-95 pb-180">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-xl-5 col-lg-6">
                            <div class="section-title mb-25">
                                <h2>Best place for learn everything</h2>
                            </div>
                            <div class="learn-content">
                                <p>Online learning program designed to prepare you for a career. Courses include recorded video lectures, auto-graded and
                                peer-reviewed assignments, and community discussion.</p>
                                <div class="row learn-wrap">
                                    <div class="single-learn-box">
                                        <a href="#"><i class="fab fa-codepen"></i><span>Engineering</span></a>
                                    </div>
                                    <div class="single-learn-box">
                                        <a href="#"><i class="far fa-building"></i><span>Architecture</span></a>
                                    </div>
                                    <div class="single-learn-box">
                                        <a href="#"><i class="fas fa-chart-pie"></i><span>Economics</span></a>
                                    </div>
                                    <div class="single-learn-box">
                                        <a href="#"><i class="far fa-edit"></i><span>Mathematic</span></a>
                                    </div>
                                    <div class="single-learn-box">
                                        <a href="#"><i class="fas fa-dollar-sign"></i><span>Business</span></a>
                                    </div>
                                    <div class="single-learn-box">
                                        <a href="#"><i class="fas fa-laptop"></i><span>Computer</span></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-4 offset-xl-2 col-lg-5 col-md-6 offset-md-3 margin-left-lg">
                            <div class="trial-wrap">
                                <div class="trial-form text-center">
                                    <h2>7 Days Free Trial</h2>
                                    <form action="#">
                                        <input type="text" placeholder="Your Name">
                                        <input type="email" placeholder="Your Mail">
                                        <input type="text" placeholder="Your Phone">
                                        <textarea name="message" id="message" placeholder="Your Message"></textarea>
                                        <button class="btn">Claim Your Free Trial</button>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="trial-bg-img"><img src="img/images/trial_img.png" alt="img"></div>
            </section>
            <!-- learn-area-end -->
            <!-- courses-area -->
            <section class="courses-area gray-bg pt-137 pb-120">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-xl-6 col-lg-8">
                            <div class="section-title text-center mb-35">
                                <h2>Popular Courses</h2>
                                <p>Online learning program designed to prepare you for a career</p>
                            </div>
                        </div>
                    </div>
                    <div class="row courses-active">
                        <div class="col-xl-3">
                            <div class="single-courses mb-30">
                                <div class="courses-thumb">
                                    <img src="img/courses/course_img01.jpg" alt="img">
                                    <div class="courses-avatar">
                                        <div class="courses-avatar-img">
                                            <img src="img/courses/courses_avatar.png" alt="img">
                                        </div>
                                        <p>Andrew Hemer</p>
                                    </div>
                                </div>
                                <div class="courses-content p-relative">
                                    <p class="courses-price">$10</p>
                                    <span><i class="far fa-bookmark"></i> Javascript</span>
                                    <h4><a href="#">Introduction to basic javascript</a></h4>
                                    <div class="courses-meta">
                                        <ul>
                                            <li class="courses-user"><i class="far fa-user"></i> 10,455</li>
                                            <li class="courses-rating">
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3">
                            <div class="single-courses mb-30">
                                <div class="courses-thumb">
                                    <img src="img/courses/course_img02.jpg" alt="img">
                                    <div class="courses-avatar">
                                        <div class="courses-avatar-img">
                                            <img src="img/courses/courses_avatar.png" alt="img">
                                        </div>
                                        <p>Andrew Hemer</p>
                                    </div>
                                </div>
                                <div class="courses-content p-relative">
                                    <p class="courses-price">$10</p>
                                    <span><i class="far fa-bookmark"></i> Javascript</span>
                                    <h4><a href="#">Introduction to basic javascript</a></h4>
                                    <div class="courses-meta">
                                        <ul>
                                            <li class="courses-user"><i class="far fa-user"></i> 10,455</li>
                                            <li class="courses-rating">
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3">
                            <div class="single-courses mb-30">
                                <div class="courses-thumb">
                                    <img src="img/courses/course_img03.jpg" alt="img">
                                    <div class="courses-avatar">
                                        <div class="courses-avatar-img">
                                            <img src="img/courses/courses_avatar.png" alt="img">
                                        </div>
                                        <p>Andrew Hemer</p>
                                    </div>
                                </div>
                                <div class="courses-content p-relative">
                                    <p class="courses-price">$10</p>
                                    <span><i class="far fa-bookmark"></i> Javascript</span>
                                    <h4><a href="#">Introduction to basic javascript</a></h4>
                                    <div class="courses-meta">
                                        <ul>
                                            <li class="courses-user"><i class="far fa-user"></i> 10,455</li>
                                            <li class="courses-rating">
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3">
                            <div class="single-courses mb-30">
                                <div class="courses-thumb">
                                    <img src="img/courses/course_img04.jpg" alt="img">
                                    <div class="courses-avatar">
                                        <div class="courses-avatar-img">
                                            <img src="img/courses/courses_avatar.png" alt="img">
                                        </div>
                                        <p>Andrew Hemer</p>
                                    </div>
                                </div>
                                <div class="courses-content p-relative">
                                    <p class="courses-price">$10</p>
                                    <span><i class="far fa-bookmark"></i> Javascript</span>
                                    <h4><a href="#">Introduction to basic javascript</a></h4>
                                    <div class="courses-meta">
                                        <ul>
                                            <li class="courses-user"><i class="far fa-user"></i> 10,455</li>
                                            <li class="courses-rating">
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3">
                            <div class="single-courses mb-30">
                                <div class="courses-thumb">
                                    <img src="img/courses/course_img02.jpg" alt="img">
                                    <div class="courses-avatar">
                                        <div class="courses-avatar-img">
                                            <img src="img/courses/courses_avatar.png" alt="img">
                                        </div>
                                        <p>Andrew Hemer</p>
                                    </div>
                                </div>
                                <div class="courses-content p-relative">
                                    <p class="courses-price">$10</p>
                                    <span><i class="far fa-bookmark"></i> Javascript</span>
                                    <h4><a href="#">Introduction to basic javascript</a></h4>
                                    <div class="courses-meta">
                                        <ul>
                                            <li class="courses-user"><i class="far fa-user"></i> 10,455</li>
                                            <li class="courses-rating">
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3">
                            <div class="single-courses mb-30">
                                <div class="courses-thumb">
                                    <img src="img/courses/course_img01.jpg" alt="img">
                                    <div class="courses-avatar">
                                        <div class="courses-avatar-img">
                                            <img src="img/courses/courses_avatar.png" alt="img">
                                        </div>
                                        <p>Andrew Hemer</p>
                                    </div>
                                </div>
                                <div class="courses-content p-relative">
                                    <p class="courses-price">$10</p>
                                    <span><i class="far fa-bookmark"></i> Javascript</span>
                                    <h4><a href="#">Introduction to basic javascript</a></h4>
                                    <div class="courses-meta">
                                        <ul>
                                            <li class="courses-user"><i class="far fa-user"></i> 10,455</li>
                                            <li class="courses-rating">
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                                <i class="fas fa-star"></i>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- courses-area-end -->
            <!-- testimonial-area -->
            <section class="testimonial-area testimonial-padding theme-bg pt-150 pb-150">
                <div class="container">
                    <div class="row justify-content-between">
                        <div class="col-lg-6 pt-30 pt-md-none">
                            <div class="section-title white-title mb-35">
                                <h2>Testimonial</h2>
                            </div>
                            <div class="testimonial-active">
                                <div class="single-testimonial">
                                    <p>Vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra nequeac
                                    eleifend.....</p>
                                    <div class="testi-author">
                                        <h5>Martin Hedges</h5>
                                        <span>Student - Math</span>
                                    </div>
                                </div>
                                <div class="single-testimonial">
                                    <p>Vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra nequeac
                                    eleifend.....</p>
                                    <div class="testi-author">
                                        <h5>Tanvu Redges</h5>
                                        <span>Student - Math</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-5 col-lg-6 d-none d-lg-block">
                            <div class="testimonial-img">
                                <i class="fas fa-quote-right"></i>
                                <img src="img/images/testimonial_img01.jpg" alt="img">
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- testimonial-area-end -->
            <!-- brand-area -->
            <div class="brand-area brand-padding pt-145 pb-140">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-lg-10">
                            <div class="brand-title text-center mb-40">
                                <h5>Top Thought Leaders Run Their Business On Edugain</h5>
                            </div>
                        </div>
                    </div>
                    <div class="row justify-content-center">
                        <div class="col-xl-10 col-lg-11">
                            <div class="brand-active">
                                <div class="single-barnd text-center">
                                    <img src="img/brand/brand_05.png" alt="img">
                                </div>
                                <div class="single-barnd text-center">
                                    <img src="img/brand/brand_02.png" alt="img">
                                </div>
                                <div class="single-barnd text-center">
                                    <img src="img/brand/brand_03.png" alt="img">
                                </div>
                                <div class="single-barnd text-center">
                                    <img src="img/brand/brand_04.png" alt="img">
                                </div>
                                <div class="single-barnd text-center">
                                    <img src="img/brand/brand_01.png" alt="img">
                                </div>
                                <div class="single-barnd text-center">
                                    <img src="img/brand/brand_03.png" alt="img">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- brand-area-end -->
            <!-- courses-create -->
            <section class="courses-create courses-create-p">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-xl-9 col-lg-11">
                            <div class="section-title text-center mb-65">
                                <h2>Our powerful platform are easy <br> & useful for create courses</h2>
                            </div>
                        </div>
                    </div>
                    <div class="row align-items-center">
                        <div class="col-lg-3 col-sm-6">
                            <div class="single-c-create mb-40">
                                <h4>Create Quizzes</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                            <div class="single-c-create mb-40">
                                <h4>Students Feedback</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                            <div class="single-c-create mb-40">
                                <h4>Multimedia Lectures</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                            <div class="single-c-create mb-40">
                                <h4>List Segmentation</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                        </div>
                        <div class="col-lg-6 d-none d-lg-block">
                            <div class="c-create-img text-center">
                                <img src="img/images/courses_create_img.png" alt="img">
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6">
                            <div class="single-c-create mb-40">
                                <h4>Promotions</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                            <div class="single-c-create mb-40">
                                <h4>Tools Integrations</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                            <div class="single-c-create mb-40">
                                <h4>Easy Builder</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                            <div class="single-c-create mb-40">
                                <h4>Page Editor</h4>
                                <p>Online learning program that is designed to prepare your courses</p>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- courses-create-end -->
            <!-- instructor-area -->
            <section class="instructor-area gray-bg pt-137">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-xl-6 col-lg-8">
                            <div class="section-title text-center mb-65">
                                <h2>Top Instructor</h2>
                                <p>Online learning program designed to prepare you for a career</p>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-3 col-sm-6">
                            <div class="single-instructor text-center mb-30">
                                <div class="instructor-thumb">
                                    <a href="#"><img src="img/instructor/instructor_img01.jpg" alt="img"></a>
                                </div>
                                <div class="instructor-content">
                                    <h4><a href="#">David Haul</a></h4>
                                    <span>Mathematics</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6">
                            <div class="single-instructor text-center mb-30">
                                <div class="instructor-thumb">
                                    <a href="#"><img src="img/instructor/instructor_img02.jpg" alt="img"></a>
                                </div>
                                <div class="instructor-content">
                                    <h4><a href="#">Rabeya Lauren</a></h4>
                                    <span>Mathematics</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6">
                            <div class="single-instructor text-center mb-30">
                                <div class="instructor-thumb">
                                    <a href="#"><img src="img/instructor/instructor_img03.jpg" alt="img"></a>
                                </div>
                                <div class="instructor-content">
                                    <h4><a href="#">Niki Jafrin</a></h4>
                                    <span>Mathematics</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6">
                            <div class="single-instructor text-center mb-30">
                                <div class="instructor-thumb">
                                    <a href="#"><img src="img/instructor/instructor_img04.jpg" alt="img"></a>
                                </div>
                                <div class="instructor-content">
                                    <h4><a href="#">Shampn Khati</a></h4>
                                    <span>Mathematics</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- instructor-area-end -->
            <!-- cta-area -->
            <section class="cta-area gray-bg pt-107 pb-150">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-xl-8 col-lg-10">
                            <div class="section-title text-center mb-40">
                                <h2>Become An Instructor</h2>
                                <p>Online learning program designed to prepare you for a career that can change
                                your life from before. Register for instructor</p>
                            </div>
                            <div class="cta-btn text-center">
                                <a href="#" class="btn">Apply for An Instructor</a>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- cta-area-end -->
            <!-- event-area -->
            <section class="event-area theme-bg pt-137">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-xl-6 col-lg-8">
                            <div class="section-title white-title text-center mb-65">
                                <h2>Latest Event</h2>
                                <p>Online learning program designed to prepare you for a career</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="container-fluid event-container-p">
                    <div class="row event-active">
                        <div class="col-xl-4">
                            <div class="single-event mb-50">
                                <div class="event-thumb p-relative">
                                    <img src="img/event/event_img01.jpg" alt="img">
                                    <div class="event-overlay">
                                        <div class="event-date">
                                            <h4>02<span>Dec</span></h4>
                                        </div>
                                        <div class="event-content">
                                            <div class="event-meta mb-10">
                                                <ul>
                                                    <li><i class="far fa-clock"></i> 09:00 AM</li>
                                                    <li><i class="fas fa-map-marker-alt"></i> Nc Auditorium, Lous</li>
                                                </ul>
                                            </div>
                                            <h5><a href="#">Business development ceremony for BBA student</a></h5>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-4">
                            <div class="single-event mb-50">
                                <div class="event-thumb p-relative">
                                    <img src="img/event/event_img02.jpg" alt="img">
                                    <div class="event-overlay">
                                        <div class="event-date">
                                            <h4>02<span>Dec</span></h4>
                                        </div>
                                        <div class="event-content">
                                            <div class="event-meta mb-10">
                                                <ul>
                                                    <li><i class="far fa-clock"></i> 09:00 AM</li>
                                                    <li><i class="fas fa-map-marker-alt"></i> Nc Auditorium, Lous</li>
                                                </ul>
                                            </div>
                                            <h5><a href="#">Business development ceremony for BBA student</a></h5>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-4">
                            <div class="single-event mb-50">
                                <div class="event-thumb p-relative">
                                    <img src="img/event/event_img03.jpg" alt="img">
                                    <div class="event-overlay">
                                        <div class="event-date">
                                            <h4>02<span>Dec</span></h4>
                                        </div>
                                        <div class="event-content">
                                            <div class="event-meta mb-10">
                                                <ul>
                                                    <li><i class="far fa-clock"></i> 09:00 AM</li>
                                                    <li><i class="fas fa-map-marker-alt"></i> Nc Auditorium, Lous</li>
                                                </ul>
                                            </div>
                                            <h5><a href="#">Business development ceremony for BBA student</a></h5>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-4">
                            <div class="single-event mb-50">
                                <div class="event-thumb p-relative">
                                    <img src="img/event/event_img01.jpg" alt="img">
                                    <div class="event-overlay">
                                        <div class="event-date">
                                            <h4>02<span>Dec</span></h4>
                                        </div>
                                        <div class="event-content">
                                            <div class="event-meta mb-10">
                                                <ul>
                                                    <li><i class="far fa-clock"></i> 09:00 AM</li>
                                                    <li><i class="fas fa-map-marker-alt"></i> Nc Auditorium, Lous</li>
                                                </ul>
                                            </div>
                                            <h5><a href="#">Business development ceremony for BBA student</a></h5>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- event-area-end -->
            <!-- enrolling-area -->
            <section class="enrolling-area enrolling-bg" data-background="img/images/map_bg.png">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-xl-8 col-lg-10">
                            <div class="section-title text-center mb-45">
                                <h2>Thousands of Students are enrolling in everyday</h2>
                            </div>
                            <div class="enrolling-btn text-center">
                                <a href="#" class="btn">Start A Course</a>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class="enrolling-img mt-45">
                                <img src="img/images/enrolling_img.png" alt="img">
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- enrolling-area-end -->
        </main>
        <!-- main-area-end -->
        <!-- footer -->
        <footer class="footer-area black-bg">
            <div class="footer-top-wrap pt-95 pb-40">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-3 col-sm-6">
                            <div class="footer-widget mb-50">
                                <div class="fw-logo mb-15">
                                    <a href="index.html"><img src="img/logo/w_logo.png" alt="Logo"></a>
                                </div>
                                <div class="footer-text">
                                    <p>We provides universal access to the world’s best education, partnering with top universities and make with top students
                                    with great result.</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 pr-50">
                            <div class="footer-widget mb-50">
                                <div class="fw-title mb-20">
                                    <h4>Useful Links</h4>
                                </div>
                                <div class="fw-link">
                                    <ul>
                                        <li><a href="#"><i class="fas fa-angle-right"></i> Home</a></li>
                                        <li><a href="#"><i class="fas fa-angle-right"></i> About</a></li>
                                        <li><a href="#"><i class="fas fa-angle-right"></i> Courses</a></li>
                                        <li><a href="#"><i class="fas fa-angle-right"></i> Instructor</a></li>
                                        <li><a href="#"><i class="fas fa-angle-right"></i> Blog</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 pr-40">
                            <div class="footer-widget mb-50">
                                <div class="fw-title mb-20">
                                    <h4>Latest News</h4>
                                </div>
                                <div class="fw-blog">
                                    <ul>
                                        <li>
                                            <div class="fw-blog-thumb">
                                                <a href="#"><img src="img/blog/f_blog01.jpg" alt="img"></a>
                                            </div>
                                            <div class="fw-blog-content">
                                                <h6><a href="#">Students are more heretic then before</a></h6>
                                                <span>04 jun, 2019</span>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="fw-blog-thumb">
                                                <a href="#"><img src="img/blog/f_blog02.jpg" alt="img"></a>
                                            </div>
                                            <div class="fw-blog-content">
                                                <h6><a href="#">Don't be silly in taking action in life</a></h6>
                                                <span>04 jun, 2019</span>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 pr-40">
                            <div class="footer-widget mb-50">
                                <div class="fw-title mb-20">
                                    <h4>Contact Us</h4>
                                </div>
                                <div class="fw-contact">
                                    <ul>
                                        <li><i class="fas fa-phone"></i> 545 - 123 - 467</li>
                                        <li><i class="far fa-envelope"></i> ourmail@infomail.com</li>
                                        <li><i class="fas fa-map-marker-alt"></i> Northern East, USA</li>
                                        <li><i class="fas fa-fax"></i> 123 456 789 0</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="container">
                <div class="copyright-wrap">
                    <div class="row align-items-center">
                        <div class="col-md-8">
                            <div class="copyright-text">
                                <p>&copy; Copyrights 2019 TUTOHUB Designed By Love. All rights reserved.</p>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="copyright-social text-center text-md-right">
                                <ul>
                                    <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
                                    <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                    <li><a href="#"><i class="fab fa-instagram"></i></a></li>
                                    <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                                    <li><a href="#"><i class="fab fa-pinterest-p"></i></a></li>
                                    <li><a href="#"><i class="fab fa-google-plus-g"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </footer>
        <!-- footer-end -->
		<!-- JS here -->
        <script src="js/vendor/jquery-1.12.4.min.js"></script>
        <script src="js/popper.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/isotope.pkgd.min.js"></script>
        <script src="js/slick.min.js"></script>
        <script src="js/jquery.meanmenu.min.js"></script>
        <script src="js/ajax-form.js"></script>
        <script src="js/wow.min.js"></script>
        <script src="js/aos.js"></script>
        <script src="js/jquery.nice-select.min.js"></script>
        <script src="js/jquery.counterup.min.js"></script>
        <script src="js/jquery.waypoints.min.js"></script>
        <script src="js/jquery.scrollUp.min.js"></script>
        <script src="js/imagesloaded.pkgd.min.js"></script>
        <script src="js/jquery.magnific-popup.min.js"></script>
        <script src="js/plugins.js"></script>
        <script src="js/main.js"></script>



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


热门标签: 行业 企业 公司 工厂 分类 响应式 自适应 设备 风格 颜色 企业 行业 公司 工厂 bootstrap bootstrap自适应 bootstrap响应式 欧美风 欧美 欧洲 美洲 pc+wap 移动+电脑 手机+电脑 绿色 简洁 简约 简单 教育培训 教育 培训 教育培训行业 教育行业 培训行业

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

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

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