diff --git a/.history/jsconfig_20231122103559.json b/.history/jsconfig_20231122103559.json
new file mode 100644
index 0000000..4aafc5f
--- /dev/null
+++ b/.history/jsconfig_20231122103559.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "baseUrl": "./",
+    "moduleResolution": "node",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  }
+}
diff --git a/.history/jsconfig_20231122105629.json b/.history/jsconfig_20231122105629.json
new file mode 100644
index 0000000..587b289
--- /dev/null
+++ b/.history/jsconfig_20231122105629.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "baseUrl": "./",
+    "moduleResolution": "node",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  }
+}
\ No newline at end of file
diff --git a/.history/jsconfig_20231122105631.json b/.history/jsconfig_20231122105631.json
new file mode 100644
index 0000000..587b289
--- /dev/null
+++ b/.history/jsconfig_20231122105631.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "baseUrl": "./",
+    "moduleResolution": "node",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  }
+}
\ No newline at end of file
diff --git a/.history/src/views/Index_20231122103559.vue b/.history/src/views/Index_20231122103559.vue
new file mode 100644
index 0000000..0247862
--- /dev/null
+++ b/.history/src/views/Index_20231122103559.vue
@@ -0,0 +1,23 @@
+<template>
+  <div class="home">
+    <p>11111111111</p>
+    <RouterView />
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122103836.vue b/.history/src/views/Index_20231122103836.vue
new file mode 100644
index 0000000..6d98cb5
--- /dev/null
+++ b/.history/src/views/Index_20231122103836.vue
@@ -0,0 +1,31 @@
+<template>
+  <div>
+    <div class="header">
+      
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105654.vue b/.history/src/views/Index_20231122105654.vue
new file mode 100644
index 0000000..38ae5d9
--- /dev/null
+++ b/.history/src/views/Index_20231122105654.vue
@@ -0,0 +1,31 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105657.vue b/.history/src/views/Index_20231122105657.vue
new file mode 100644
index 0000000..1c09916
--- /dev/null
+++ b/.history/src/views/Index_20231122105657.vue
@@ -0,0 +1,31 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105716.vue b/.history/src/views/Index_20231122105716.vue
new file mode 100644
index 0000000..34c2560
--- /dev/null
+++ b/.history/src/views/Index_20231122105716.vue
@@ -0,0 +1,32 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105752.vue b/.history/src/views/Index_20231122105752.vue
new file mode 100644
index 0000000..4c45fce
--- /dev/null
+++ b/.history/src/views/Index_20231122105752.vue
@@ -0,0 +1,36 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header{
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105814.vue b/.history/src/views/Index_20231122105814.vue
new file mode 100644
index 0000000..e648e90
--- /dev/null
+++ b/.history/src/views/Index_20231122105814.vue
@@ -0,0 +1,41 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105821.vue b/.history/src/views/Index_20231122105821.vue
new file mode 100644
index 0000000..2013308
--- /dev/null
+++ b/.history/src/views/Index_20231122105821.vue
@@ -0,0 +1,41 @@
+<template>
+  <div>
+    <div class="header">
+      <p>头部</p>
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      <p>底部</p>
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105824.vue b/.history/src/views/Index_20231122105824.vue
new file mode 100644
index 0000000..721cc48
--- /dev/null
+++ b/.history/src/views/Index_20231122105824.vue
@@ -0,0 +1,43 @@
+<template>
+  <div>
+    <div class="header">
+      <p>头部</p>
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      <p>底部</p>
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105854.vue b/.history/src/views/Index_20231122105854.vue
new file mode 100644
index 0000000..179d5b9
--- /dev/null
+++ b/.history/src/views/Index_20231122105854.vue
@@ -0,0 +1,43 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105855.vue b/.history/src/views/Index_20231122105855.vue
new file mode 100644
index 0000000..179d5b9
--- /dev/null
+++ b/.history/src/views/Index_20231122105855.vue
@@ -0,0 +1,43 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105923.vue b/.history/src/views/Index_20231122105923.vue
new file mode 100644
index 0000000..befd22a
--- /dev/null
+++ b/.history/src/views/Index_20231122105923.vue
@@ -0,0 +1,44 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+  font-size: 18px;
+}
+
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+}
+
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/.history/src/views/Index_20231122105931.vue b/.history/src/views/Index_20231122105931.vue
new file mode 100644
index 0000000..eb034bb
--- /dev/null
+++ b/.history/src/views/Index_20231122105931.vue
@@ -0,0 +1,45 @@
+<template>
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
+  </div>
+</template>
+
+<script>
+import { RouterView } from "vue-router";
+
+export default {
+  name: "index",
+  components: { RouterView },
+};
+</script>
+<style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+  font-size: 18px;
+}
+
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+  font-size: 18px;
+}
+
+p {
+  font-size: 20px;
+  width: 100px;
+  height: 100px;
+  background-color: red;
+}
+</style>
diff --git a/jsconfig.json b/jsconfig.json
index 4aafc5f..587b289 100644
--- a/jsconfig.json
+++ b/jsconfig.json
@@ -16,4 +16,4 @@
       "scripthost"
     ]
   }
-}
+}
\ No newline at end of file
diff --git a/src/views/Index.vue b/src/views/Index.vue
index 0247862..eb034bb 100644
--- a/src/views/Index.vue
+++ b/src/views/Index.vue
@@ -1,7 +1,15 @@
 <template>
-  <div class="home">
-    <p>11111111111</p>
-    <RouterView />
+  <div>
+    <div class="header">
+      头部
+    </div>
+    <div class="home">
+      <p>11111111111</p>
+      <RouterView />
+    </div>
+    <div class="footer">
+      底部
+    </div>
   </div>
 </template>
 
@@ -14,6 +22,20 @@ export default {
 };
 </script>
 <style scoped>
+.header {
+  width: 100%;
+  height: 4%;
+  color: black;
+  font-size: 18px;
+}
+
+.footer {
+  width: 100%;
+  height: 4%;
+  color: black;
+  font-size: 18px;
+}
+
 p {
   font-size: 20px;
   width: 100px;