diff --git a/docs/.vitepress/devui-theme/styles/code.scss b/docs/.vitepress/devui-theme/styles/code.scss
index dcb528b228fbb51077b86a03cc82b50197f8be3d..93312a9eba871d748c26bedd191d18bbfee8b5db 100644
--- a/docs/.vitepress/devui-theme/styles/code.scss
+++ b/docs/.vitepress/devui-theme/styles/code.scss
@@ -7,7 +7,7 @@ code {
   font-family: var(--code-font-family);
   font-size: 0.85em;
   color: var(--c-text-light);
-  background-color: var(--code-inline-bg-color);
+  background-color: $devui-area !important;
 }
 
 code .token.deleted {
diff --git a/docs/.vitepress/devui-theme/styles/demo-block.scss b/docs/.vitepress/devui-theme/styles/demo-block.scss
index 99cfb66970559ea6c9f4791fa88009d60e3be574..3c7b4b881d28f2ba93bac9cd5fe79fed557f128c 100644
--- a/docs/.vitepress/devui-theme/styles/demo-block.scss
+++ b/docs/.vitepress/devui-theme/styles/demo-block.scss
@@ -1,5 +1,26 @@
 @import '@devui/styles-var/devui-var.scss';
 
+.demo-block {
+  border: solid 1px $devui-dividing-line !important;
+
+  &.hover {
+    box-shadow: $devui-shadow-length-base $devui-shadow !important;
+  }
+}
+
 .demo-block-control {
   background-color: $devui-base-bg !important;
+  border-top: solid 1px $devui-dividing-line !important;
+
+  &:hover {
+    color: $devui-brand !important;
+  }
+
+  .control-button {
+    color: $devui-brand !important;
+  }
+}
+
+.meta {
+  border-top: solid 1px $devui-dividing-line !important;
 }
diff --git a/docs/.vitepress/devui-theme/styles/layout.scss b/docs/.vitepress/devui-theme/styles/layout.scss
index 1af92258cdc3d7ea1680f2b7071ad1d06f1763de..a25c86d6cdb49d5caeb7a24f28f21251e8021d16 100644
--- a/docs/.vitepress/devui-theme/styles/layout.scss
+++ b/docs/.vitepress/devui-theme/styles/layout.scss
@@ -125,7 +125,7 @@ textarea {
 
 a {
   text-decoration: none;
-  color: var(--c-brand);
+  color: $devui-brand;
 }
 
 a:hover {
diff --git a/docs/components/card/index.md b/docs/components/card/index.md
index 6065bbc5d9d0f09b0690f108b3bcf23c1b8a8dce..ce05231eb54256db466377ebc319c94ab546f4ea 100644
--- a/docs/components/card/index.md
+++ b/docs/components/card/index.md
@@ -125,7 +125,7 @@
 
 <d-card class="d-card" align="spaceBetween">
   <div class="custom-avatar">
-    <d-avatar imgSrc="https://devui.design/components/assets/logo.svg" width=48 height=48 isRound="false"></d-avatar>
+    <d-avatar imgSrc="https://devui.design/components/assets/logo.svg" width=48 height=48 :isRound="false"></d-avatar>
     <div class="icon-star-o custom-star-action"></div>
   </div>
   <template v-slot:cardTitle>
@@ -143,7 +143,7 @@
 ```html
 <d-card class="d-card" align="spaceBetween">
   <div class="custom-avatar">
-    <d-avatar imgSrc="https://devui.design/components/assets/logo.svg" width=48 height=48 isRound="false"></d-avatar>
+    <d-avatar imgSrc="https://devui.design/components/assets/logo.svg" width=48 height=48 :isRound="false"></d-avatar>
     <div class="icon-star-o custom-star-action"></div>
   </div>
   <template v-slot:cardTitle>
diff --git a/docs/components/overlay/index.md b/docs/components/overlay/index.md
index 264cfbc5c4ffd335892f3e245850c2fc1ee6a52b..2fecc9afc2d97df22e5275eda525ff4e4e227f41 100644
--- a/docs/components/overlay/index.md
+++ b/docs/components/overlay/index.md
@@ -1,4 +1,4 @@
-## 遮罩层
+# 遮罩层
 遮罩层属于基础组件，用于构建独立于当前页面布局的组件。
 ### 何时使用
 当你需要全局弹窗，或者需要元素跟随功能，便可以使用该组件。