diff --git a/blossom-web/src/views/index/HomeSubject.vue b/blossom-web/src/views/index/HomeSubject.vue
index e7c5990..dde228e 100644
--- a/blossom-web/src/views/index/HomeSubject.vue
+++ b/blossom-web/src/views/index/HomeSubject.vue
@@ -64,7 +64,7 @@ const toToc = (articleId: number) => {
     border-radius: 5px;
     padding: 5px 10px;
     margin: 15px 16px;
-    transition: 0.3s;
+    transition: border 0.3s, box-shadow 0.3s;
     box-shadow: 0 0 12px rgba(0, 0, 0, 0.1);
     overflow: hidden;
 
@@ -72,7 +72,7 @@ const toToc = (articleId: number) => {
       font-size: 12px;
       margin-right: 5px;
       opacity: 0;
-      transition: 0.3s;
+      transition: opacity 0.3s;
     }
 
     &:hover {
@@ -87,7 +87,6 @@ const toToc = (articleId: number) => {
         text-shadow: 5px 5px 15px #000, -3px -3px 10px rgba(255, 255, 255, 0.5);
       }
 
-      .cover,
       .cover-name {
         opacity: 1;
       }
@@ -107,7 +106,7 @@ const toToc = (articleId: number) => {
       height: 35px;
       font-weight: 700;
       color: #cdcdcd;
-      transition: 0.3s;
+      transition: text-shadow 0.3s;
     }
 
     .words {
@@ -134,7 +133,7 @@ const toToc = (articleId: number) => {
       box-shadow: 0 0 10px 1px #181818;
       text-align: center;
       transform: scale(0.8) rotate(45deg);
-      transition: 0.3s;
+      transition: opacity 0.3s;
     }
 
     .describes {