diff --git a/docs/content/components/menu-item.mdx b/docs/content/components/menu-item.mdx
new file mode 100644
index 00000000..6d5405fd
--- /dev/null
+++ b/docs/content/components/menu-item.mdx
@@ -0,0 +1,57 @@
+---
+title: MenuItem 菜单项
+date: 2019-08-16
+author: lijianxin1202
+---
+
+菜单条目
+
+## 使用场景
+
+- 通常在下拉框中作为不同的菜单选项
+
+### 常规
+
+```jsx
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+## API
+
+| 参数 | 类型 | 默认值 | 说明 |
+| ------- | ------------------------- | ------ | -------- |
+| active | boolean | | 高亮显示菜单项，表示菜单项被选中。 |
+| disabled | boolean | false | 禁用菜单项，使其不能被选中。 |
+| divider | all | false | 将此菜单项显示为水平分隔线，用在一组菜单项之间的区块分隔。 |
+| eventKey | any | 传送给 onSelect 处理函数的参数, 用于标记选中菜单项的关键字。 |
+| header | boolean | false | 将菜单项的风格显示为标题头标签，用来描述一组菜单项 |
+| href | string | | HTML href 与 a.href 相关的属性 |
+| onClick | function | | 菜单被点击时调用的回调函数。 |
+| onSelect | function | | 菜单被选中时调用的回调函数。 |
+| bsClass | string | 'dropdown' | 定义组件基础 CSS 及前缀。通常改变 bsClass 目的是为组件提供新的、非 Bootstrap 自带样式。 |
diff --git a/docs/content/components/nav-dropdown.mdx b/docs/content/components/nav-dropdown.mdx
new file mode 100644
index 00000000..401279fb
--- /dev/null
+++ b/docs/content/components/nav-dropdown.mdx
@@ -0,0 +1,34 @@
+---
+title: NavDropdown 导航条
+date: 2019-08-15
+author: lijianxin1202
+---
+
+以下拉方式导航
+
+## 使用场景
+
+- 在子导航较多时，可以用下拉方式来节省空间
+
+### 常规
+
+```jsx
+
+```
+
+## API
+
+| 参数 | 类型 | 默认值 | 说明 |
+| ------- | ------------------------- | ------ | -------- |
+| active | boolean | false | 当前是否处于选中状态 |
+| noCaret | boolean | false | 隐藏箭头图标 |
+| eventKey | any | | 唯一标识符，用来和其他项进行区分 |
+| title | React.ReactNode | | 下拉框标题 |
diff --git a/docs/content/components/nav-item.mdx b/docs/content/components/nav-item.mdx
new file mode 100644
index 00000000..f72e0956
--- /dev/null
+++ b/docs/content/components/nav-item.mdx
@@ -0,0 +1,39 @@
+---
+title: NavItem 导航条目
+date: 2019-08-16
+author: lijianxin1202
+---
+
+导航中的条目
+
+## 使用场景
+
+- 当导航条目中内容比较复杂时，可使用 NavItem
+
+### 常规
+
+```jsx
+
+```
+
+## API
+
+| 参数 | 类型 | 默认值 | 说明 |
+| ------- | ------------------------- | ------ | -------- |
+| active | boolean | false | 当前是否处于选中状态 |
+| disabled | boolean | false | 隐藏箭头图标 |
+| role | string | | |
+| href | string | | 跳转链接 |
+| onClick | function | | 点击事件 |
+| onSelect | function | 选中事件 |
+| eventKey | any | | 唯一标识符，用来和其他项进行区分 |
diff --git a/docs/content/components/nav.mdx b/docs/content/components/nav.mdx
new file mode 100644
index 00000000..b925d43d
--- /dev/null
+++ b/docs/content/components/nav.mdx
@@ -0,0 +1,121 @@
+---
+title: Nav 导航
+date: 2019-08-16
+author: lijianxin1202
+---
+
+导航
+
+## 使用场景
+
+- 用于在页面顶部、底部或侧边提供各种跳转
+
+### 常规
+
+```jsx
+
+```
+
+### 下拉方式
+
+```jsx
+
+```
+### 堆叠方式
+使用 stacked 让按钮垂直排列。
+
+```jsx
+
+```
+
+### 两边对齐
+使用 justified 让导航条充满父容器的宽度。
+
+```jsx
+
+
+
+
+
+```
+
+## API
+
+| 参数 | 类型 | 默认值 | 说明 |
+| ------- | ------------------------- | ------ | -------- |
+| activeKey | any | | 导航条目的 eventKey 与此属性匹配的激活，优行级高于 activeHref 匹配 |
+| activeHref | string | | 导航条目的 href 与此属性值一致的显示为激活 |
+| stacked | boolean | false | 垂直排列 |
+| justified | all | false | 充满父容器的宽度 |
+| onSelect | function | | 选中事件 |
+| role | string | | 导航 ARIA 角色, 在 TabContainer 上下文中, 缺省值设为 "tablist", 可以被 Nav 重新设置 |
+| navbar | boolean | | 在 Navbar 中使用时应用对齐风格，这个属性使用在 Navbar 中会自动设置上。 |
+| pullRight | boolean | false | 浮动 Nav 至右侧. 当 navbar 为 true 时，必要上下文样式会被添加。 |
+| pullLeft | boolean | false | 浮动 Nav 至左侧. 当 navbar 为 true 时，必要上下文样式会被添加。 |
+| bsStyle | one of: "tabs", "pills" | | 定义组件可视的或上下文相关的样式属性。 |
+| bsClass | string | 'nav' | 定义组件基础 CSS 及前缀。通常改变 bsClass 目的是为组件提供新的、非 Bootstrap 自带样式。 |