diff --git a/docs/components/demo-block.vue b/docs/components/demo-block.vue
index dbea6f879..09fcbabf9 100644
--- a/docs/components/demo-block.vue
+++ b/docs/components/demo-block.vue
@@ -3,19 +3,8 @@
     class="demo-block"
     :class="blockClass">
     <slot name="examples"></slot>
-    <div class="highlight-wrapper">
-      <div class="highlight-toggle">
-        <span v-text="description"></span>
-        <i class="zan-icon zan-icon-arrow" @click="showCode = !showCode" :class="{
-          'zan-icon-arrow-close': !showCode
-        }">
-        </i>
-      </div>
-      <div class="highlight-code" v-show="showCode">
-        <slot name="highlight">
-        </slot>
-      </div>
-    </div>
+      <slot name="highlight">
+      </slot>
   </div>
 </template>
 
@@ -25,12 +14,6 @@ export default {
     description: String
   },
 
-  data() {
-    return {
-      showCode: true
-    };
-  },
-
   computed: {
     blockClass() {
       return `demo-${this.$route.path.split('/').pop()}`;
@@ -59,8 +42,6 @@ export default {
 
     .examples {
       width: 320px;
-      height: 568px;
-      background: url(https://b.yzcdn.cn/v2/image/wap/zanui-mobile-demo.png) no-repeat;
       float: right;
       box-sizing: border-box;
       padding: 74px 0 0;
@@ -69,7 +50,7 @@ export default {
       overflow: auto;
     }
 
-    .highlight-wrapper {
+    .highlight {
       margin-right: 345px;
       box-sizing: border-box;
       border: 1px solid #E5E5E5;
@@ -92,32 +73,5 @@ export default {
         }
       }
     }
-
-    .highlight-toggle {
-      padding: 20px;
-      border-bottom: 1px solid #e5e5e5;
-      color: #666;
-      position: relative;
-
-      .zan-icon {
-        position: absolute;
-        top: 20px;
-        right: 20px;
-        width: 20px;
-        height: 20px;
-        line-height: 20px;
-        text-align: center;
-        font-size: 12px;
-        color: #888;
-        transform: rotate(-90deg);
-        border: 2px solid #888;
-        border-radius: 50%;
-        cursor: pointer;
-
-        &.zan-icon-arrow-close {
-          transform: rotate(90deg);
-        }
-      }
-    }
   }
 </style>
diff --git a/docs/examples-docs/button.md b/docs/examples-docs/button.md
index 1c68712e5..fe482d0cb 100644
--- a/docs/examples-docs/button.md
+++ b/docs/examples-docs/button.md
@@ -17,13 +17,11 @@
 
 ## Button 按钮
 
-### 使用指南
+### 按钮功能
 
-一些使用指南。
+只接受`primary`, `default`, `danger`三种类型，默认`default`。
 
-### 代码示例
-
-:::demo 按钮功能，只接受primary, default, danger三种类型，默认default。
+:::demo 按钮功能
 ```html
 <zan-row>
   <zan-col span="24">
@@ -39,6 +37,8 @@
 ```
 :::
 
+### 禁用状态
+
 :::demo 禁用状态
 ```html
 <zan-row>
@@ -49,7 +49,11 @@
 ```
 :::
 
-:::demo 按钮尺寸，只接受`large`, `normal`, `small`, `mini`四种尺寸，默认`normal`。
+### 按钮尺寸
+
+只接受`large`, `normal`, `small`, `mini`四种尺寸，默认`normal`。
+
+:::demo 按钮尺寸
 ```html 
 <zan-row>
   <zan-col span="24">
@@ -70,7 +74,11 @@
 ```
 :::
 
-:::demo 自定义按钮标签，按钮默认是`button`标签，可以使用`tag`属性修改为一个`a`标签。
+### 自定义按钮标签
+
+按钮默认是`button`标签，可以使用`tag`属性修改为一个`a`标签。
+
+:::demo 自定义按钮标签
 ```html 
 <zan-row>
   <zan-col span="24">
@@ -80,6 +88,8 @@
 ```
 :::
 
+### loading按钮
+
 :::demo loading按钮
 ```html 
 <zan-row>
@@ -93,6 +103,8 @@
 ```
 :::
 
+### button group
+
 :::demo button group
 ```html 
 <div class="button-group">