diff --git a/src/Answer.vue b/src/Answer.vue
new file mode 100644
index 0000000..284df48
--- /dev/null
+++ b/src/Answer.vue
@@ -0,0 +1,124 @@
+<template>
+  <div class="box">
+    <heads></heads>
+    <div class="bodys">
+      <div class="nav">
+        <p class="selection">为你推荐</p>
+        <p>全站热门</p>
+        <p>邀请回答(68)</p>
+        <p></p>
+      </div>
+      <div class="Recommend" v-show="false">
+        <input type="text" placeholder="添加擅长话题" />
+      </div>
+      <div class="Popular" v-show="false">
+        <div class="strip">
+          <p class>如何评价谷歌的优化GEMM论文The Indirect Convolution Algorithm？</p>
+          <p>3 个回答 · 255 人关注</p>
+        </div>
+        <div class="strip">
+          <p class>如何评价谷歌的优化GEMM论文The Indirect Convolution Algorithm？</p>
+          <p>3 个回答 · 255 人关注</p>
+        </div>
+        <div class="strip">
+          <p class>如何评价谷歌的优化GEMM论文The Indirect Convolution Algorithm？</p>
+          <p>3 个回答 · 255 人关注</p>
+        </div>
+      </div>
+      <div class="Invitation">
+        <div class="screen"></div>
+      </div>
+    </div>
+  </div>
+</template>
+<style lang="scss" scoped>
+.box {
+  padding-top: 90px;
+  .bodys {
+    width: 100%;
+    min-height: 360px;
+    background-color: #fff;
+    .nav {
+      display: flex;
+      padding: 18px 30px;
+      > p {
+        font-size: 30px;
+        color: #666;
+        padding: 22px 32px;
+        border-bottom: #ccc solid 1px;
+      }
+      > p:last-child {
+        width: 10px;
+      }
+      .selection {
+        border: #ccc solid 1px;
+        border-bottom: none;
+      }
+    }
+    .Recommend {
+      margin-top: 27px;
+      margin-left: 30px;
+      > input {
+        width: 510px;
+        height: 80px;
+        box-sizing: border-box;
+        font-size: 26px;
+        padding: 27px 21px;
+        border: #ccc solid 1px;
+        border-radius: 5px;
+      }
+    }
+    .Popular {
+      padding: 0 30px;
+      .strip {
+        padding: 26px 0 40px 0;
+        border-bottom: #ccc solid 1px;
+        //   width: 100%;
+        > p {
+          font-size: 30px;
+          color: #465a33;
+          width: 604px;
+        }
+        > p:last-child {
+          font-size: 26px;
+          color: #999;
+          margin-top: 18px;
+        }
+      }
+    }
+    .Invitation {
+      padding: 0 30px;
+      .strip {
+        padding: 26px 0 40px 0;
+        border-bottom: #ccc solid 1px;
+        //   width: 100%;
+        > p {
+          font-size: 30px;
+          color: #465a33;
+          width: 604px;
+        }
+        > p:last-child {
+          font-size: 26px;
+          color: #999;
+          margin-top: 18px;
+        }
+      }
+      .screen {
+          
+      }
+    }
+  }
+}
+</style>
+<script>
+import heads from "./components/indexhead";
+export default {
+  name: "Answer",
+  data() {
+    return {};
+  },
+  components: {
+    heads
+  }
+};
+</script>
\ No newline at end of file
diff --git a/src/router.js b/src/router.js
index 80f2e5b..6063fe5 100644
--- a/src/router.js
+++ b/src/router.js
@@ -11,6 +11,7 @@ import IndexArticleDetail from "./IndexArticleDetail"
 import login from "./login"
 import loginpwd from "./loginpwd"
 import indexfind from "./IndexFind"
+import Answer from "./Answer"
 const router=new Router({
   routes: [
     {
@@ -41,6 +42,11 @@ const router=new Router({
       path: '/PersonalHomepage',
       component: PersonalHomepage
     }
+    ,
+    {
+      path: '/Answer',
+      component: Answer
+    }
     
   ]
 });