diff --git a/layout/page.ejs b/layout/page.ejs
index bfdb9b2..5105aec 100644
--- a/layout/page.ejs
+++ b/layout/page.ejs
@@ -1,6 +1,6 @@
 <!-- 通用页面模板 -->
 <div class="page-container">
-    <div class="page-left">
+    <div class="page-left animated">
         <%- partial('left-side') %>
     </div>
     <div class="page-right">
diff --git a/layout/right-side.ejs b/layout/right-side.ejs
index 339a745..21ce0b9 100644
--- a/layout/right-side.ejs
+++ b/layout/right-side.ejs
@@ -1,8 +1,8 @@
 <div class="right-side-container">
-    <div class="nav-container">
+    <div class="nav-container animated">
         <%- partial('common/nav') %>
     </div>
-    <div class="article-post-container">
+    <div class="article-post-container animated">
         <% if (is_home()) { %>
             <!-- 载入首页的内容 -->
             <%- partial('common/home-post') %>
diff --git a/source/css/animated.styl b/source/css/animated.styl
index d6829e7..be6836c 100644
--- a/source/css/animated.styl
+++ b/source/css/animated.styl
@@ -1,6 +1,7 @@
 .animated {
   animation-fill-mode: both;
   animation-duration: 1s;
+  animation-name fade-in-down
 }
 
 .animated.hinge {
@@ -18,7 +19,3 @@
     transform: translateY(0);
   }
 }
-
-.fade-in-down {
-  animation-name: fade-in-down;
-}