首页

css/index.css

@@ -18,3 +18,156 @@
     rgba(13, 27, 46, 0.7) 100%
   );
 }
+.home_main {
+  background-color: #fff;
+}
+.home_superiority_title {
+  margin: 0 auto;
+  width: 13rem;
+  padding: 1rem 0;
+  font-size: 0.4rem;
+  font-weight: 700;
+  text-align: center;
+  color: #333;
+}
+.home_superiority_info {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 0 auto;
+  width: 13rem;
+  height: 3.3rem;
+}
+.home_superiority_info .superiority_item {
+  max-width: 25%;
+  text-align: center;
+}
+.home_superiority_info .superiority_item_img {
+  display: block;
+  margin: 0 auto;
+  width: 0.84rem;
+}
+.home_superiority_info .superiority_item_title {
+  padding: 0.25rem 0;
+  font-size: 0.28rem;
+  color: #333;
+}
+.home_superiority_info .superiority_item_stitle {
+  font-size: 0.16rem;
+  color: #999;
+  line-height: 0.3rem;
+}
+.home_scheme_info {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 0 auto;
+  padding: 0.7rem 0;
+  width: 13rem;
+}
+.home_scheme_info .scheme_left {
+  width: 4.74rem;
+}
+.home_scheme_info .scheme_left .scheme_left_title {
+  padding: 0.3rem 0;
+  font-size: 0.28rem;
+  color: #333;
+}
+.home_scheme_info .scheme_left .scheme_left_stitle {
+  font-size: 0.18rem;
+  color: #999;
+  line-height: 0.32rem;
+}
+.home_scheme_info .scheme_right {
+  display: inline-block;
+  width: 8.25rem;
+}
+.home_scheme_info .scheme_left_btn {
+  position: relative;
+  margin-top: 1rem;
+  width: 2rem;
+  height: 0.58rem;
+  font-size: 0.16rem;
+  font-weight: 700;
+  border: 0.01rem solid #333;
+  transition: all .3s ease-out;
+  -webkit-transition: all .3s ease-out;
+  cursor: pointer;
+}
+.home_scheme_info .scheme_left_btn .mask_bg {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  margin: 0;
+  width: 0;
+  height: 0.58rem;
+  transition: all .3s ease-out;
+  -webkit-transition: all .3s ease-out;
+}
+.home_scheme_info .scheme_left_btn:hover .mask_bg {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: 0;
+  width: 2rem;
+  height: 0.58rem;
+}
+.home_scheme_info .scheme_left_btn .scheme_btn_info {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  z-index: 999;
+}
+.home_scheme_info .scheme_left_btn:hover {
+  color: #fff;
+  border: 0.01rem solid #2D8CF0;
+}
+.home_scheme_info .scheme_left_btn img {
+  margin-left: 0.2rem;
+  width: 0.2rem;
+  height: 0.06rem;
+}
+.home_scheme_info .scheme_left_btn .jiantou_right {
+  display: block;
+}
+.home_scheme_info .scheme_left_btn .jiantou_right1 {
+  display: none;
+}
+.home_scheme_info .scheme_left_btn:hover .jiantou_right {
+  display: none;
+}
+.home_scheme_info .scheme_left_btn:hover .jiantou_right1 {
+  display: block;
+}
+.home_introduce_title {
+  padding-top: 0.68rem;
+  font-size: 0.4rem;
+  color: #000;
+  text-align: center;
+}
+.home_introduce_stitle {
+  padding: 0.22rem 0;
+  font-size: 0.16rem;
+  color: #000;
+  text-align: center;
+}
+.home_introduce_main {
+  margin: 0 auto;
+  padding: 0.75rem 0;
+  width: 13rem;
+  background-color: #fff;
+  color: #666;
+  font-size: 0.16rem;
+}
+.home_introduce_main_left {
+  margin-left: 0.35rem;
+}
+.home_introduce_main_left .introduce_main_left_title {
+  font-size: 0.28rem;
+  color: #333;
+}

index.html

@@ -5,6 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>河南星火燎原软件科技有限公司</title>
+    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
     <link rel="stylesheet" href="./librarys/swiper@3.4.2/swiper.min.css" />
     <link rel="stylesheet" href="./css/comm.css" />
     <link rel="stylesheet" href="./css/index.css" />
@@ -24,6 +25,94 @@
       <!-- 如果需要分页器 -->
       <div class="swiper-pagination"></div>
     </div>
+    <div class="home_main">
+      <div class="home_superiority_title">我们的优势</div>
+      <div class="home_superiority_info">
+        <div class="superiority_item">
+          <img
+            class="superiority_item_img"
+            src="./img/home/superiority/datong.png"
+          />
+          <div class="superiority_item_title">打通教育全流程</div>
+          <div class="superiority_item_stitle">
+            为K12全流程、全方位<br />提供智能服务
+          </div>
+        </div>
+        <div class="superiority_item">
+          <img
+            class="superiority_item_img"
+            src="./img/home/superiority/zhuanzhu.png"
+          />
+          <div class="superiority_item_title">专注K12智慧教育</div>
+          <div class="superiority_item_stitle">
+            为教育行业提供全方位<br />实时音频解决方案
+          </div>
+        </div>
+        <div class="superiority_item">
+          <img
+            class="superiority_item_img"
+            src="./img/home/superiority/shuju.png"
+          />
+          <div class="superiority_item_title">数据安全及稳定性</div>
+          <div class="superiority_item_stitle">数据安全及稳定性有保障</div>
+        </div>
+        <div class="superiority_item">
+          <img
+            class="superiority_item_img"
+            src="./img/home/superiority/fuwu.png"
+          />
+          <div class="superiority_item_title">服务保障</div>
+          <div class="superiority_item_stitle">全流程 全方 位服务保障</div>
+        </div>
+      </div>
+      <div class="home_scheme_info">
+        <div class="scheme_left">
+          <div class="scheme_left_title">应用方案</div>
+          <div class="scheme_left_stitle">
+            构建互联网+大数据+智慧教育，高效智能平台，<br />量体裁衣，满足客户个性化需求
+          </div>
+          <div class="scheme_left_btn">
+            <img class="mask_bg" src="./img/home/scheme/mask.png" />
+            <div class="scheme_btn_info">
+              了解更多
+              <img
+                class="jiantou_right"
+                src="./img/home/scheme/jiantou_right.png"
+              />
+              <img
+                class="jiantou_right1"
+                src="./img/home/scheme/jiantou_right1.png"
+              />
+            </div>
+          </div>
+        </div>
+        <img class="scheme_right" src="./img/home/scheme/banner.png" />
+      </div>
+    </div>
+    <div class="home_introduce_title">方案介绍</div>
+    <div class="home_introduce_stitle">
+      提升学校数据共享能力、加速释放数据价值
+    </div>
+    <div class="home_introduce_main">
+      <div class="home_introduce_main_left">
+        <div class="introduce_main_left_title">采集学生全过程</div>
+        <div>
+          <div>
+            学习行为数据,精准诊断学生知识点学习情况，<br />
+            让管理者基于数据科学决策，让教师基于学情<br />
+            精准教学，让学生基于知识掌握程度精准学习。
+          </div>
+          <div>
+            实现从个人到整体、从微观到宏观的全面数据<br />
+            呈现，帮助教育管理者快速了解教育动态，助<br />
+            力科学决策，助力师生增效减负。
+          </div>
+        </div>
+      </div>
+      <div>
+
+      </div>
+    </div>
     <div class="footer_root"></div>
     <script src="./librarys/jquery@1.12.4/jquery.min.js"></script>
     <script src="./librarys/swiper@3.4.2/swiper.jquery.min.js"></script>