index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta name="viewport" content="width=device-width,height=device-height,maximum-scale=1.0,user-scalable=no">
    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrait">
    <!-- UC强制全屏 -->
    <meta name="full-screen" content="yes">
    <!-- QQ强制全屏 -->
    <meta name="x5-fullscreen" content="true">
    <!-- UC应用模式 -->
    <meta name="browsermode" content="application">
    <!-- QQ应用模式 -->
    <meta name="x5-page-mode" content="app">
    <!-- windows phone 点击无高光 -->
    <meta name="msapplication-tap-highlight" content="no">
    <!-- 适应移动端end -->
    <title>优斯暑假班，火热报名中...</title>
	<link rel="icon" href="bitbug_favicon.ico" type="images/x-ico" />
    <link rel="stylesheet" type="text/css" href="static/css/utils.css">
	<link rel="stylesheet" type="text/css" href="static/css/swiper.min.css"/>
    <script type="text/javascript">
        function setRootSize(){
            var docWid = window.document.documentElement,
                width = docWid.getBoundingClientRect().width,
                fontSize = (width >= 450) ? (450 / 7.5) : width / 750 * 100;
                docWid.style.fontSize = fontSize + 'px';
        }
        window.addEventListener('resize', function() {
            setRootSize();
        }, false);
        setRootSize();
    </script>
<link rel="stylesheet" type="text/css" href="static/css/index.css">
</head>
<body>
    <header>
		<img src="static/images/banner.jpg" >
	</header>
    <section class="shipin wrap">
        <div class="shipin_box">
           
        </div>
    </section>
    <section class="jieshao wrap">
        <div class="biaoti">暑期课程介绍</div>
        <div class="jieshao_box">
            <div class="xiaobiaoti">————  科学英语  ————</div>
            <div class="mubiaobiaoti">
                <p>内容覆盖科学（Science)技术（Technology）工程（Engineering）和数学（Mathematics)4个学科领域，
				将先进的教学理念和专业的知识技能融入实际的课题设计和动手环节中，激发孩子们的求知天性和兴趣，
				从而培养学习者的多学科知识和技能。结合本次课程的8个小实验，运用语言工具，提高孩子们的学习兴趣。</p>
            </div>
			<div class="xiaobiaoti">————  分级阅读  ————</div>
			<div class="mubiaobiaoti">
			    <p>书中通过重复句式和插图塑造相关语境，帮助学生学会在真实语境下使用单词，而不是单纯的学发音、记意思。每本书的输入不超过50个字，整个级别难度螺旋上升、循序渐进。</p>
			</div>
			<div class="xiaobiaoti">————  自然拼读  ————</div>
			<div class="mubiaobiaoti">
			    <p>破除音标符号记忆障碍，直接掌握发音规律。先听说、在读写，回归汉语母语学习路径。 见词会读、听音能力，提升孩子信心、增强学习兴趣。帮助孩子开启阅读大门。（如同拼音对孩子学习中文阅读的作用）</p>
			</div>
        </div>
    </section>
    <section class="tese wrap">
        <div class="biaoti">特色课程</div>
        <ul>
            <li>
				<div class="swiper-container imgswiper">
					<div class="swiper-wrapper">
					  <div class="swiper-slide">
						  <div class="img"><img src="static/images/kx.png"></div>
						   <div class="words">
							   <h6>科学英语</h6>
							  <p>一种非常规范的CLIL课堂，全天全英文、全场景以科学课程为载体，
							  能够以孩子好奇心的为英语学习的内驱力，让孩子在课堂中积极思考，
							  更容易形成英文思维。提升孩子英文能力的同时又能够提升孩子的认知。
							  </p>
							  <!-- <div class="jg"><span>半托课程：￥4880</span><span>全托课程：￥5980</span></div> -->
						  </div>
					   </div>
					  <div class="swiper-slide">
						  <div class="img"><img src="static/images/fj.png"></div>
						   <div class="words">
							   <h6>英语分级阅读</h6>
							  <p>按照学习者不同年龄段的智力水平、心理发育程度，
							  以及英语语言水平而专为学习者提供的科学阅读计划，
							  为不同水平的学习者提供有针对性的读物。
							  </p>
							  <!-- <div class="jg"><span>半托课程：￥4880</span><span>全托课程：￥5980</span></div> -->
						  </div>
					  </div>
					   <div class="swiper-slide">
						  <div class="img"><img src="static/images/zr.png"></div>
						   <div class="words">
							   <h6>自然拼读</h6>
							  <p>自然拼读是一个学习很有用的工具，在孩子具备一听力的基础上，
							  使用自然拼读法从字母发音直接到单词发音规律，
							  让孩子迅速具备见词能读、听音能写，大大提高孩子阅读信心和阅读能力的建立。
							  </p>
							  <!-- <div class="jg"><span>半托课程：￥4880</span><span>全托课程：￥5980</span></div> -->
						  </div>
					   </div>
					</div>
					<!-- Add Scrollbar -->
					<div class="swiper-scrollbar"></div>
				 </div>
            </li>
        </ul>
    </section>
	
	 <section class="wrap mingshi">
	    <div class="biaoti">教学目标</div>
	    <div class="mingshi_box">
			<div><span>科学英语</span>
				<p>课堂通过探索式的小实验学习正确的研究方法，培养孩子自主分析能力。多样的教具能满足孩子的丰富想象。课后演讲提高提高孩子语言表达能力。更轻松的进入小学的学习阶段，帮助孩子更好度过转型期。</p>
			</div>
			<div><span>分级阅读</span>
				<p>全外教授课 ，10天课程学习8本书，阅读量可达1000. 核心词汇300。每本书都会提供不同的阅读策略，积累阅读技巧通过思维导图带孩子们理解并讲述这个故事。促进听说读写能力全面发展，获得更多的信息和知识，同时为小升初准备。</p>
			</div>
			<div><span>自然拼读</span>
				<p>掌握129个语音知识，约1300个阅读实用词汇，包含翻翻卡词汇615个，小学核心词汇420个，sight word 220个，歌曲歌谣近30首。</p>
			</div>
	    </div>
	</section>
    <section class="fuwutixi wrap">
        <div class="biaoti">暑期课程限时优惠</div>
       <div class="yh">
		   <div class="yh1">
			   <h2>4月25日—5月26日</h2>
			   <p>1、价格减免800</p>
			   <p>2、送299元的点读笔或者200元的其他礼品</p>
			   <p>3、送500元无期限续费优惠券</p>
			   <span id="hd1">距离截止日期还有：<i id="t1"></i><i id="s1"></i><i id="f1"></i><i id="m1"></i></span>
		   </div>
		   <div class="yh1" style="margin-top: .2rem;">
		   			   <h2>5月27日—6月16日</h2>
		   			   <p>1、价格减免500</p>
		   			   <p>2、送299元的点读笔或者200元的其他礼品</p>
		   			   <p>3、送500元无期限续费优惠券</p>
					   <p>(只能选两项了哦)</p>
					    <span id="hd2">距离截止日期还有：<i id="t2"></i><i id="s2"></i><i id="f2"></i><i id="m2"></i></span>
		   </div>
		   <div class="yh1" style="margin-top: .2rem;">
		   			   <h2>6月17日—7月7日</h2>
		   			   <p>价格减免500</p>
					   <span id="hd3">距离截止日期还有：<i id="t3"></i><i id="s3"></i><i id="f3"></i><i id="m3"></i></span>
		   </div>
	   </div>
    </section>
	 <section class="baoming wrap">
	    <div class="biaoti" style="margin-bottom: .5rem;">填写信息马上报名</div>
		<input type="text" id="name" placeholder="请输入您的姓名">
		<br>
		<input type="number" type="phone" id="phone" maxlength="11" placeholder="请输入您的手机号">
		<br>
		<div class="xzxq">
			<input type="text" id="xq" placeholder="请选择校区"/>
			<ul id="xzxq">
				<li>纬五路校区</li>
				<li>国基路校区</li>
				<li>郑东校区</li>
				<li>汝河路校区</li>
				<li>华强校区</li>
			</ul>
		</div>
		
		<button type="button" id="bm">立即报名</button>
		<img src="static/images/xiaoxiang%20.png" >
	</section>
    <footer wrap></footer>
</body>
<script type="text/javascript" src="static/js/swiper.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script src="static/js/cut.js" type="text/javascript"></script>
<script type="text/javascript">
	 var imgswiperswiper = new Swiper('.imgswiper', {
	  autoplay: true,
      scrollbar: {
        el: '.swiper-scrollbar',
        hide: true,
      },
    });
</script>
</html>