diff --git a/index.html b/index.html
index e4a0f8b..6cb6f3d 100644
--- a/index.html
+++ b/index.html
@@ -1,13 +1,13 @@
 <!doctype html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<head>
+    <meta charset="UTF-8"/>
+    <link href="/vite.svg" rel="icon" type="image/svg+xml"/>
+    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
     <title>CANTYONION.SITE</title>
-  </head>
-  <body>
-    <div id="app"></div>
-    <script type="module" src="/src/main.ts"></script>
-  </body>
+</head>
+<body>
+<div id="app"></div>
+<script src="/src/main.ts" type="module"></script>
+</body>
 </html>
diff --git a/src/components/card/IntroCard.vue b/src/components/card/IntroCard.vue
index 58e0f2d..ff6755a 100644
--- a/src/components/card/IntroCard.vue
+++ b/src/components/card/IntroCard.vue
@@ -31,23 +31,23 @@ const littleWidget: Widget[] = [
 </script>
 
 <template>
-  <div class="container w-full flex my-16">
+  <div class="container my-16 flex w-full">
     <!-- 头像部分 -->
-    <div class="w-32 h-32 rounded-full bg-white overflow-hidden hover:animate-pulse hidden sm:block">
+    <div class="hidden h-32 w-32 overflow-hidden rounded-full bg-white hover:animate-pulse sm:block">
       <img alt="" src="https://q.qlogo.cn/g?b=qq&nk=1922471905&s=640">
     </div>
 
     <!--  文字部分  -->
-    <div class="container flex-1 px-4 sm:px-8 flex flex-col justify-between">
+    <div class="container flex flex-1 flex-col justify-between px-4 sm:px-8">
       <div class="text-4xl">Jeffrey Hsu</div>
       <div class="text-2xl text-gray-400">你好👋，很高兴认识你！</div>
       <!--      <vue-typed-js :strings="['First text', 'Second Text']">-->
       <!--        <h1 class="typing"></h1>-->
       <!--      </vue-typed-js>-->
-      <div class="flex text-xl gap-4">
+      <div class="flex gap-4 text-xl">
         <a v-for="item in littleWidget"
            :key="item.url" :href=item.url :title=item.title
-           class="w-10 h-10 rounded-full bg-green-400 flex items-center justify-center text-white transition-all hover:scale-125">
+           class="flex h-10 w-10 items-center justify-center rounded-full bg-green-400 text-white transition-all hover:scale-125">
           <font-awesome-icon :icon="item.icon"/>
         </a>
       </div>
diff --git a/src/components/nav/NavBar.vue b/src/components/nav/NavBar.vue
index 1860ac2..cdf1033 100644
--- a/src/components/nav/NavBar.vue
+++ b/src/components/nav/NavBar.vue
@@ -27,17 +27,17 @@ const littleWidget: Widget[] = [
 
 <template>
   <nav
-      class="w-full h-16 bg-white shadow backdrop-blur-md bg-opacity-70 fixed text-gray-600 z-20"
+      class="fixed z-20 h-16 w-full bg-white bg-opacity-70 text-gray-600 shadow backdrop-blur-md"
   >
-    <div class="w-full container flex justify-center sm:justify-between items-center mx-auto">
+    <div class="container mx-auto flex w-full items-center justify-center sm:justify-between">
       <!--  Logo  -->
-      <div class="min-w-16 h-full text-4xl logo py-3.5">
+      <div class="h-full text-4xl min-w-16 logo py-3.5">
         <span>CantyOni_on's Index</span>
       </div>
       <!--  Entry  -->
       <!--      <div class="flex-1"></div>-->
       <!--  快速跳转小组件  -->
-      <div class="items-center justify-between gap-4 text-xl hidden sm:flex">
+      <div class="hidden items-center justify-between gap-4 text-xl sm:flex">
         <a v-for="item in littleWidget"
            :key="item.url" :href=item.url :title=item.title
            class="transition-all hover:scale-125">
@@ -47,7 +47,7 @@ const littleWidget: Widget[] = [
     </div>
   </nav>
   <!-- 用于隔开元素的 -->
-  <div class="h-16 w-full mb-4"></div>
+  <div class="mb-4 h-16 w-full"></div>
 </template>
 
 <style scoped>
