编程技术

Document

Web网站模板-教育培训响应式网站模板(HTML+CSS+JavaScript)

<div class="container">

  <div class="row">

    <div class="col-lg-6 align-self-center">

      <div class="header-text">

        <h6>Welcome to our school</h6>

        <h2>Best Place To Learn Graphic <em>Design!</em></h2>

        <div class="main-button-gradient">

          <div class="scroll-to-section"><a href="#contact-section">Join Us Now!</a></div>

        </div>

      </div>

    </div>

    <div class="col-lg-6">

      <div class="right-image">

        <img src="assets/images/banner-right-image.png" alt="">

      </div>

    </div>

  </div>

</div>

<div class="container">

  <div class="row">

    <div class="col-lg-12">

      <div class="section-heading">

        <h6>我们的服务</h6>

        <h4>Provided <em>服务</em></h4>

      </div>

    </div>

    <div class="col-lg-12">

      <div class="owl-service-item owl-carousel">

        <div class="item">

          <div class="service-item">

            <div class="icon">

              <img src="assets/images/service-icon-01.png" alt="">

            </div>

            <h4>Useful Tricks</h4>

            <p>EduWell is the professional HTML5 template for your school or university websites.</p>

          </div>

        </div>

        <div class="item">

          <div class="service-item">

            <div class="icon">

              <img src="assets/images/service-icon-02.png" alt="">

            </div>

            <h4>Creative Ideas</h4>

            <p>You can download and use this EduWell Template for your teaching and learning stuffs.</p>

          </div>

        </div>

      </div>

    </div>

  </div>

</div>




[]( )课程列表

==============================================================



![image-20220222163055118](https://img-blog.csdnimg.cn/img_convert/0aadf2dd2139e8027e4a5f30de149992.png)



[]( )学员评价

==============================================================



![image-20220222163205172](https://img-blog.csdnimg.cn/img_convert/a3c3d7aba36b388abafa5827d285d816.png)



[]( )联系我们

==============================================================



![image-20220222163231737](https://img-blog.csdnimg.cn/img_convert/b846382b860b1d6d57cb6ae7cc48309c.png)




<div class="container">

  <div class="row">

    <div class="col-lg-8">

      <div id="map">

      

        <!-- You just need to go to Google Maps for your own map point, and copy the embed code from Share -> Embed a map section -->

        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d7151.84524236698!2d-122.19494600413192!3d47.56605883252286!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x5490695e625f8965%3A0xf99b055e76477def!2sNewcastle%20Beach%20Park%20Playground%2C%20Bellevue%2C%20WA%2098006%2C%20USA!5e0!3m2!1sen!2sth!4v1644335269264!5m2!1sen!2sth" width="100%" height="420px" frameborder="0" style="border:0; border-radius: 15px; position: relative; z-index: 2;" allowfullscreen=""></iframe>

        <div class="row">

          <div class="col-lg-4 offset-lg-1">

            <div class="contact-info">

              <div class="icon">

                <i class="fa fa-phone"></i>

              </div>

              <h4>Phone</h4>

              <span>010-020-0340</span>

            </div>

          </div>

          <div class="col-lg-4">

            <div class="contact-info">

              <div class="icon">

                <i class="fa fa-phone"></i>

              </div>

              <h4>Mobile</h4>

              <span>090-080-0760</span>

            </div>

          </div>

        </div>

      </div>

    </div>

    <div class="col-lg-4">

      <form id="contact" action="" method="post">

        <div class="row">

          <div class="col-lg-12">

            <div class="section-heading">

              <h6>Contact us</h6>

              <h4>Say <em>Hello</em></h4>

              <p>IF you need a working contact form by PHP script, please visit template's contact page for more info.</p>

            </div>

          </div>

          <div class="col-lg-12">

            <fieldset>

              <input type="name" name="name" id="name" placeholder="Full Name" autocomplete="on" required>

            </fieldset>

          </div>

          <div class="col-lg-12">

            <fieldset>

              <input type="text" name="email" id="email" pattern="[^ @]*@[^ @]*" placeholder="Your Email" required="">

            </fieldset>

          </div>

          <div class="col-lg-12">

            <fieldset>

              <textarea name="message" id="message" placeholder="Your Message"></textarea>

            </fieldset>

          </div>

          <div class="col-lg-12">

            <fieldset>

              <button type="submit" id="form-submit" class="main-gradient-button">Send Message</button>

            </fieldset>

          </div>

        </div>

      </form>

    </div>

    <div class="col-lg-12">

      <ul class="social-icons">

        <li><a href="#"><i class="fa fa-facebook"></i></a></li>

        <li><a href="#"><i class="fa fa-twitter"></i></a></li>

        <li><a href="#"><i class="fa fa-linkedin"></i></a></li>

        <li><a href="#"><i class="fa fa-rss"></i></a></li>

        <li><a href="#"><i class="fa fa-dribbble"></i></a></li>

      </ul>

    </div>

    <div class="col-lg-12">

      <p class="copyright">Copyright © 2022 EduWell Co., Ltd. All Rights Reserved. 

      

      <br>Design: <a rel="sponsored" href="https://template.com" target="_blank">template</a></p>

    </div>

  </div>

</div>




[]( )完整代码

==============================================================



获取完整源码：关注公众号【搞前端的半夏】回复\[网站模板\]，免费获取源码。回复\[网站模板\],免费获取50+套模板  

大家点赞、收藏、关注、评论啦 、查看👇🏻👇🏻👇🏻微信公众号获取👇🏻👇🏻👇🏻



![在这里插入图片描述](https://img-blog.csdnimg.cn/cd9e522539f749419f6645747c73464e.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5pCe5YmN56uv55qE5Y2K5aSP,size_20,color_FFFFFF,t_70,g_se,x_16)