diff --git a/src/assets/banner/banner1.jpg b/src/assets/banner/banner1.jpg
new file mode 100644
index 0000000..32e1d39
Binary files /dev/null and b/src/assets/banner/banner1.jpg differ
diff --git a/src/assets/banner/banner2.jpg b/src/assets/banner/banner2.jpg
new file mode 100644
index 0000000..4b1e2f7
Binary files /dev/null and b/src/assets/banner/banner2.jpg differ
diff --git a/src/assets/banner/banner3.jpg b/src/assets/banner/banner3.jpg
new file mode 100644
index 0000000..38b4512
Binary files /dev/null and b/src/assets/banner/banner3.jpg differ
diff --git a/src/components/Carousel.vue b/src/components/Carousel.vue
new file mode 100644
index 0000000..e37afd7
--- /dev/null
+++ b/src/components/Carousel.vue
@@ -0,0 +1,46 @@
+<template>
+  <el-row>
+    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+      <div class="slideshow">
+        <el-carousel trigger="click" height="745px">
+          <el-carousel-item v-for="(item,index) in bannerDate" :key="index">
+            <div>
+              <img :src="item.imgurl" alt="">
+            </div>
+          </el-carousel-item>
+        </el-carousel>
+      </div>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+export default {
+  name: "Carousel",
+  data() {
+    return {
+      bannerDate: [
+        {
+          imgurl: require('@/assets/banner/banner1.jpg')
+        }, {
+          imgurl: require('@/assets/banner/banner2.jpg')
+        },
+        {
+          imgurl: require('@/assets/banner/banner3.jpg')
+        }
+      ]
+    }
+  }
+}
+</script>
+
+<style scoped>
+.slideshow {
+  width: 100%;
+}
+
+img {
+  width: 100%;
+
+}
+</style>
diff --git a/src/components/FastFindProducts.vue b/src/components/FastFindProducts.vue
new file mode 100644
index 0000000..89ea86c
--- /dev/null
+++ b/src/components/FastFindProducts.vue
@@ -0,0 +1,41 @@
+<template>
+  <div>
+    <el-row type="flex" style="height: 122px">
+      <el-col :span="4">
+      </el-col>
+      <el-col :span="16">
+        <div class="fast_left">
+          <p>
+            快速查找产品
+          </p>
+          <p>
+            可以快速地找到合适你的产品
+          </p>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "FastFindProducts"
+}
+</script>
+
+<style scoped lang="scss">
+.fast_left{
+  margin-top: 24px;
+  float: left;
+  p:first-child{
+    color: #333;
+    font-size: 24px;
+    line-height: 43px;
+  }
+  p:last-child{
+    color: #666;
+    font-size: 14px;
+    line-height: 25px;
+  }
+}
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index 0702782..1120766 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -21,7 +21,7 @@ const routes = [
   },
   {
     path: '/news',
-    name: 'index',
+    name: 'news',
     component: () => import('../views/news/index')
   },
 ]
diff --git a/src/views/header/index.vue b/src/views/header/index.vue
index f24c001..7762abe 100644
--- a/src/views/header/index.vue
+++ b/src/views/header/index.vue
@@ -23,7 +23,7 @@
           </a>
         </div>
         <div class="down_right">
-          <ul>
+          <ul >
             <li v-for="(item,index) in navList" :key="index" class="nav">
               <a :href="item.href" class="nav_item">
                 {{ item.title }}
@@ -50,7 +50,7 @@ export default {
     return {
       navList: [
         {
-          href: '',
+          href: '/',
           title: '网站首页',
         },
         {
@@ -107,11 +107,11 @@ export default {
             }
           ]
         }, {
-          href: '',
+          href: '/news',
           title: '新闻资讯',
           children:[
             {
-              href: '',
+              href: '/news',
               title:'公司新闻'
             },
             {
@@ -159,7 +159,6 @@ export default {
 </script>
 
 <style scoped lang="scss">
-
 .header_bg {
   height: 130px;
   width: 100%;
@@ -233,6 +232,10 @@ export default {
 
           .subNav{
             display: none;
+            clear: both;
+            position: absolute;
+            top: 85px;
+            left: 0;
             width: 100px;
             background-color: #000;
             padding: 12px 0;
diff --git a/src/views/index/index.vue b/src/views/index/index.vue
index 86a6d55..1af4dbd 100644
--- a/src/views/index/index.vue
+++ b/src/views/index/index.vue
@@ -1,12 +1,17 @@
 <template>
   <div>
-
+    <Carousel/>
+    <FastFindProducts/>
   </div>
 </template>
 
 <script>
+import Carousel from "@/components/Carousel";
+import FastFindProducts from "@/components/FastFindProducts";
+
 export default {
-  name: "index"
+  name: "index",
+  components: {FastFindProducts, Carousel}
 }
 </script>