diff --git a/note.html b/note.html
index 16f50cf5..f3e063a2 100755
--- a/note.html
+++ b/note.html
@@ -76,9 +76,8 @@ function log(o) {
         <div id="loadingLogo">
           <span class="logo"></span>
         </div>
-        <div id="allProcess" class="lang">
-        loading...
-        </div>
+        <div class="init-loading"><img src="public/images/loading-32.gif"></div>
+        <div id="allProcess" class="lang">loading...</div>
         <div id="syncProcess">
         </div>
       </td></tr></table>
diff --git a/public/themes/default.css b/public/themes/default.css
index 5d98adc3..429f11d1 100644
--- a/public/themes/default.css
+++ b/public/themes/default.css
@@ -1298,9 +1298,12 @@ h3 {
 .dropdown-menu .divider {
   margin: 3px 0;
 }
-.ace_editor {
+#left-column {
   font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
 }
+.ace_editor {
+  font-family: Menlo, 'Ubuntu Mono', Consolas, 'Courier New', 'Microsoft Yahei', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', sans-serif;
+}
 .ace_editor * {
   font-family: inherit;
 }
@@ -2950,6 +2953,15 @@ body,
 .mce-item-table tr:nth-child(2n) {
   background-color: #f7f7f9;
 }
+.init-loading {
+  display: none;
+}
+.init-loading img {
+  width: 20px;
+}
+.init .init-loading {
+  display: block;
+}
 #mdEditor .navbar-default,
 #wmd-button-bar {
   overflow: visible;
diff --git a/public/themes/default.less b/public/themes/default.less
index dcb1d488..761eefe8 100644
--- a/public/themes/default.less
+++ b/public/themes/default.less
@@ -932,4 +932,14 @@ html, body, #page, #pageInner, #noteList, #notebook, #leftNotebook {
   background-color: #f7f7f9;
 }
 
+.init-loading {
+  display: none;
+  img {
+    width: 20px;
+  }
+}
+.init .init-loading {
+  display: block;
+}
+
 @import 'includes/markdown.less';