doc: button doc

yujie-cheng · yujie-cheng · commit 95a63b3c20b8 · 2021-12-16T23:42:46.000+08:00
diff --git a/doc/markdown/nButton/en-US/index.md b/doc/markdown/nButton/en-US/index.md
@@ -6,6 +6,33 @@ A button means an operation (or a series of operations). Clicking a button will
 
 ## Examples
 
+### Basic use
+:::demo Use 'type', 'status',' shape ', etc., to define the style of the button.
+```html
+<template>
+  <div>
+    <n-button type="default">Default</n-button>
+    <n-button type="primary">Primary</n-button>
+    <n-button type="link">Link</n-button>
+    <n-button type="ghost">Ghost</n-button>
+    <n-button type="delicate">Delicate</n-button>
+  </div>
+  <div>
+    <n-button type="primary" status="success">success</n-button>
+    <n-button type="primary" status="info">info</n-button>
+    <n-button type="primary" status="warning">warning</n-button>
+    <n-button type="primary" status="danger">danger</n-button>
+  </div>
+  <div>
+    <n-button type="primary" shape="square">square</n-button>
+    <n-button type="primary" shape="square" icon="icon-search"></n-button>
+    <n-button type="primary" shape="round">round</n-button>
+    <n-button type="primary" shape="circle" icon="icon-home"></n-button>
+  </div>
+</template>
+```
+:::
+
 ### Button type
 :::demo There are five types of buttons: default button, home button, link button, ghost button, delicate button.
 ```html
