diff --git a/packages/vant-cli/site/mobile/components/DemoBlock.vue b/packages/vant-cli/site/mobile/components/DemoBlock.vue
index 65c89a033..10e5260d5 100644
--- a/packages/vant-cli/site/mobile/components/DemoBlock.vue
+++ b/packages/vant-cli/site/mobile/components/DemoBlock.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="van-doc-demo-block">
+  <div class="van-doc-demo-block" :class="demoName">
     <h2 v-if="title" class="van-doc-demo-block__title">{{ title }}</h2>
     <div v-if="card" class="van-doc-demo-block__card">
       <slot />
@@ -9,6 +9,8 @@
 </template>
 
 <script>
+import { decamelize } from '../../common';
+
 export default {
   name: 'demo-block',
 
@@ -16,6 +18,17 @@ export default {
     card: Boolean,
     title: String,
   },
+
+  computed: {
+    demoName() {
+      const { meta } = this.$route || {};
+      if (meta && meta.name) {
+        return `demo-${decamelize(meta.name)}`;
+      }
+
+      return '';
+    },
+  },
 };
 </script>