diff --git a/docs/markdown/en-US/nav-bar.md b/docs/markdown/en-US/nav-bar.md
index aaf2948ee..60d26d88a 100644
--- a/docs/markdown/en-US/nav-bar.md
+++ b/docs/markdown/en-US/nav-bar.md
@@ -52,6 +52,7 @@ export default {
 | right-text | Right Text | `String` | `''` | - |
 | left-arrow | Whether to show left arrow | `Boolean` | `false` | - |
 | fixed | Whether to fixed top | `Boolean` | `false` | - |
+| z-index | Z-index | `Number` | `1` | - |
 
 ### Slot
 
diff --git a/docs/markdown/zh-CN/nav-bar.md b/docs/markdown/zh-CN/nav-bar.md
index 073856423..d9d00a927 100644
--- a/docs/markdown/zh-CN/nav-bar.md
+++ b/docs/markdown/zh-CN/nav-bar.md
@@ -53,6 +53,7 @@ export default {
 | right-text | 右侧文案 | `String` | `''` | - |
 | left-arrow | 是否显示左侧箭头 | `Boolean` | `false` | - |
 | fixed | 是否固定在顶部 | `Boolean` | `false` | - |
+| z-index | 元素 z-index | `Number` | `1` | - |
 
 ### Slot
 
diff --git a/packages/nav-bar/index.vue b/packages/nav-bar/index.vue
index 36329689e..3bf32636d 100644
--- a/packages/nav-bar/index.vue
+++ b/packages/nav-bar/index.vue
@@ -1,5 +1,9 @@
 <template>
-  <div class="van-nav-bar van-hairline--top-bottom" :class="{ 'van-nav-bar--fixed': fixed }">
+  <div
+    class="van-nav-bar van-hairline--top-bottom"
+    :class="{ 'van-nav-bar--fixed': fixed }"
+    :style="style"
+  >
     <div class="van-nav-bar__left" @click="$emit('click-left')">
       <slot name="left">
         <icon v-if="leftArrow" class="van-nav-bar__arrow" name="arrow" />
@@ -28,7 +32,19 @@ export default create({
     leftText: String,
     rightText: String,
     leftArrow: Boolean,
-    fixed: Boolean
+    fixed: Boolean,
+    zIndex: {
+      type: Number,
+      default: 1
+    }
+  },
+
+  computed: {
+    style() {
+      return {
+        zIndex: this.zIndex
+      };
+    }
   }
 });
 </script>