diff --git a/docs/zh/components/container.md b/docs/zh/components/container.md
index 36583a16..d42e727d 100644
--- a/docs/zh/components/container.md
+++ b/docs/zh/components/container.md
@@ -1,11 +1,29 @@
 # 页面容器
 
+::: tip 提示
+`<d2-container>` 是 D2Admin 构建页面最重要的组件，请仔细阅读本文档
+:::
+
 ## 参数
 
 | 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
 | --- | --- | --- | --- | --- | --- |
-| type | 容器模式 | 非 | string | full card ghost | full |
-| scroll | 使用自定义滚动条 | 非 | boolean |  | false |
+| type | 容器模式 | 非 | String | full card ghost | full |
+| scroll | 使用自定义滚动条 | 非 | Boolean |  | false |
+| scroll-options | 自定义滚动条配置 | 非 | Object | [better-scroll](https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/options.html) | 见下 |
+
+::: tip scroll-options 默认值
+```
+{
+	mouseWheel: true,
+	scrollbar: {
+	  fade: true,
+		interactive: false
+	}
+}
+```
+设置的参数值会和默认值使用 Object.assign 合并，最后在初始化 [better-scroll](https://github.com/ustbhuangyi/better-scroll) 时传入
+:::
 
 下面的介绍中 **主区域** 范围见下
 
@@ -275,6 +293,19 @@ ghost 模式适合对页面有定制需求的用户，此模式生成一个没
 
 ![](http://fairyever.qiniudn.com/d2-container-guide-201807221232AM_ghost_bs_long-slot@2x.png)
 
+## 如何选择
+
+如果不是纯展示型页面，通常建议不要开启 scroll 属性，除非你可以通过设置 scroll-options 解决你遇到的问题
+
+::: tip 开启 scroll 属性可能会带来的问题
+* 页面文字无法选中
+* 表单控件失灵
+* 拖拽相关操作失灵
+* ...
+
+上述问题理论上都可以通过配置 scroll-options 解决，scroll-options 参数设置的对象在和默认值合并后会作为 [better-scroll](https://github.com/ustbhuangyi/better-scroll) 配置参数传入。D2Admin 暂时只对 [better-scroll](https://github.com/ustbhuangyi/better-scroll) 做了简单设置，如果你遇到了相关问题请 [better-scroll](https://github.com/ustbhuangyi/better-scroll) 相关设置文档
+:::
+
 ## 注
 
 本文插图为 [@FairyEver](https://github.com/FairyEver) 专为此文档设计，未经授权不得转载或者修改使用
diff --git a/src/components/core/d2-container/components/d2-container-card-bs.vue b/src/components/core/d2-container/components/d2-container-card-bs.vue
index f3194269..3ee538c2 100644
--- a/src/components/core/d2-container/components/d2-container-card-bs.vue
+++ b/src/components/core/d2-container/components/d2-container-card-bs.vue
@@ -17,35 +17,11 @@
 </template>
 
 <script>
-import BScroll from 'better-scroll'
+import bs from './mixins/bs'
 export default {
   name: 'd2-container-card-bs',
-  data () {
-    return {
-      BS: null
-    }
-  },
-  mounted () {
-    this.scrollInit()
-  },
-  beforeDestroy () {
-    this.scrollDestroy()
-  },
-  methods: {
-    scrollInit () {
-      this.BS = new BScroll(this.$refs.wrapper, {
-        mouseWheel: true,
-        scrollbar: {
-          fade: true,
-          interactive: false
-        }
-      })
-    },
-    scrollDestroy () {
-      if (this.BS) {
-        this.BS.destroy()
-      }
-    }
-  }
+  mixins: [
+    bs
+  ]
 }
 </script>
diff --git a/src/components/core/d2-container/components/d2-container-full-bs.vue b/src/components/core/d2-container/components/d2-container-full-bs.vue
index f43e289d..dc344c8c 100644
--- a/src/components/core/d2-container/components/d2-container-full-bs.vue
+++ b/src/components/core/d2-container/components/d2-container-full-bs.vue
@@ -15,35 +15,11 @@
 </template>
 
 <script>
-import BScroll from 'better-scroll'
+import bs from './mixins/bs'
 export default {
-  name: 'd2-container-full-bs',
-  data () {
-    return {
-      BS: null
-    }
-  },
-  mounted () {
-    this.scrollInit()
-  },
-  beforeDestroy () {
-    this.scrollDestroy()
-  },
-  methods: {
-    scrollInit () {
-      this.BS = new BScroll(this.$refs.wrapper, {
-        mouseWheel: true,
-        scrollbar: {
-          fade: true,
-          interactive: false
-        }
-      })
-    },
-    scrollDestroy () {
-      if (this.BS) {
-        this.BS.destroy()
-      }
-    }
-  }
+  name: 'd2-container-card-bs',
+  mixins: [
+    bs
+  ]
 }
 </script>
diff --git a/src/components/core/d2-container/components/d2-container-ghost-bs.vue b/src/components/core/d2-container/components/d2-container-ghost-bs.vue
index edc324be..93ca21c1 100644
--- a/src/components/core/d2-container/components/d2-container-ghost-bs.vue
+++ b/src/components/core/d2-container/components/d2-container-ghost-bs.vue
@@ -13,35 +13,11 @@
 </template>
 
 <script>
-import BScroll from 'better-scroll'
+import bs from './mixins/bs'
 export default {
-  name: 'd2-container-ghost-bs',
-  data () {
-    return {
-      BS: null
-    }
-  },
-  mounted () {
-    this.scrollInit()
-  },
-  beforeDestroy () {
-    this.scrollDestroy()
-  },
-  methods: {
-    scrollInit () {
-      this.BS = new BScroll(this.$refs.wrapper, {
-        mouseWheel: true,
-        scrollbar: {
-          fade: true,
-          interactive: false
-        }
-      })
-    },
-    scrollDestroy () {
-      if (this.BS) {
-        this.BS.destroy()
-      }
-    }
-  }
+  name: 'd2-container-card-bs',
+  mixins: [
+    bs
+  ]
 }
 </script>
diff --git a/src/components/core/d2-container/components/mixins/bs.js b/src/components/core/d2-container/components/mixins/bs.js
new file mode 100644
index 00000000..caa00be2
--- /dev/null
+++ b/src/components/core/d2-container/components/mixins/bs.js
@@ -0,0 +1,37 @@
+import BScroll from 'better-scroll'
+export default {
+  props: {
+    scrollOptions: {
+      type: Object,
+      required: false,
+      default: () => ({})
+    }
+  },
+  data () {
+    return {
+      BS: null
+    }
+  },
+  mounted () {
+    this.scrollInit()
+  },
+  beforeDestroy () {
+    this.scrollDestroy()
+  },
+  methods: {
+    scrollInit () {
+      this.BS = new BScroll(this.$refs.wrapper, Object.assign({
+        mouseWheel: true,
+        scrollbar: {
+          fade: true,
+          interactive: false
+        }
+      }, this.scrollOptions))
+    },
+    scrollDestroy () {
+      if (this.BS) {
+        this.BS.destroy()
+      }
+    }
+  }
+}
diff --git a/src/components/core/d2-container/index.vue b/src/components/core/d2-container/index.vue
index be4cf3b4..e00e826d 100644
--- a/src/components/core/d2-container/index.vue
+++ b/src/components/core/d2-container/index.vue
@@ -7,7 +7,7 @@
       <slot v-if="$slots.footer" name="footer" slot="footer"/>
     </d2-container-card>
     <!-- [card] 卡片容器 滚动优化 -->
-    <d2-container-card-bs v-if="type === 'card' && scroll">
+    <d2-container-card-bs v-bind="$attrs" v-if="type === 'card' && scroll">
       <slot v-if="$slots.header" name="header" slot="header"/>
       <slot/>
       <slot v-if="$slots.footer" name="footer" slot="footer"/>
@@ -19,7 +19,7 @@
       <slot v-if="$slots.footer" name="footer" slot="footer"/>
     </d2-container-ghost>
     <!-- [ghost] 隐形容器 滚动优化 -->
-    <d2-container-ghost-bs v-if="type === 'ghost' && scroll">
+    <d2-container-ghost-bs v-bind="$attrs" v-if="type === 'ghost' && scroll">
       <slot v-if="$slots.header" name="header" slot="header"/>
       <slot/>
       <slot v-if="$slots.footer" name="footer" slot="footer"/>
@@ -31,7 +31,7 @@
       <slot v-if="$slots.footer" name="footer" slot="footer"/>
     </d2-container-full>
     <!-- [container-full-bs] 填充 滚动优化 -->
-    <d2-container-full-bs v-if="type === 'full' && scroll">
+    <d2-container-full-bs v-bind="$attrs" v-if="type === 'full' && scroll">
       <slot v-if="$slots.header" name="header" slot="header"/>
       <slot/>
       <slot v-if="$slots.footer" name="footer" slot="footer"/>