diff --git a/examples/routers/button.vue b/examples/routers/button.vue
index 37c17a54..6aabdddf 100644
--- a/examples/routers/button.vue
+++ b/examples/routers/button.vue
@@ -9,7 +9,16 @@
         <Button type="error">Error</Button>
         <Button type="text">Text</Button>
         <br><br><br>
-        <div style="padding: 20px;background: #dddee1">
+        <Button type="default" disabled>Default</Button>
+        <Button type="primary" disabled>Primary</Button>
+        <Button type="dashed" disabled>Dashed</Button>
+        <Button type="info" disabled>Info</Button>
+        <Button type="success" disabled>Success</Button>
+        <Button type="warning" disabled>Warning</Button>
+        <Button type="error" disabled>Error</Button>
+        <Button type="text" disabled>Text</Button>
+        <br><br><br>
+        <div style="padding: 20px;background: rgb(190, 200, 200)">
             <Button type="default" ghost>Default</Button>
             <Button type="primary" ghost>Primary</Button>
             <Button type="dashed" ghost>Dashed</Button>
@@ -18,6 +27,15 @@
             <Button type="warning" ghost>Warning</Button>
             <Button type="error" ghost>Error</Button>
             <Button type="text" ghost>Text</Button>
+            <br><br><br>
+            <Button type="default" ghost disabled>Default</Button>
+            <Button type="primary" ghost disabled>Primary</Button>
+            <Button type="dashed" ghost disabled>Dashed</Button>
+            <Button type="info" ghost disabled>Info</Button>
+            <Button type="success" ghost disabled>Success</Button>
+            <Button type="warning" ghost disabled>Warning</Button>
+            <Button type="error" ghost disabled>Error</Button>
+            <Button type="text" ghost disabled>Text</Button>
         </div>
         <br><br><br>
         <Button type="primary" icon="ios-information-circle" size="small">Search</Button>
diff --git a/src/styles/components/button.less b/src/styles/components/button.less
index 5511825c..93b6da9b 100644
--- a/src/styles/components/button.less
+++ b/src/styles/components/button.less
@@ -177,4 +177,14 @@
             background: fade(tint(@error-color, 95%), 50%);
         }
     }
+
+    &-ghost&-default[disabled], &-ghost&-dashed[disabled], &-ghost&-primary[disabled], &-ghost&-info[disabled], &-ghost&-success[disabled], &-ghost&-warning[disabled], &-ghost&-error[disabled]{
+        background: transparent;
+        color: fade(#000, 25%);
+        border-color: @btn-disable-border;
+    }
+    &-ghost&-text[disabled]{
+        background: transparent;
+        color: fade(#000, 25%);
+    }
 }