diff --git a/examples/sites/src/style.css b/examples/sites/src/style.css
index 09d30b8b78..d2702b80f9 100644
--- a/examples/sites/src/style.css
+++ b/examples/sites/src/style.css
@@ -13,7 +13,9 @@ b, strong {
   --docs-tabs-header-zindex: 100;
   --docs-float-settings-zindex: 999;
   --docs-header-zindex: 200;
+  --docs-header-zindex-highlight: 2002;
   --docs-layout-sider-zindex: 201;
+  --docs-layout-sider-zindex-highlight: 2001;
 }
 
 .tinyui-design-header {
diff --git a/examples/sites/src/views/components/components.vue b/examples/sites/src/views/components/components.vue
index 9dc8354445..537fe650cf 100644
--- a/examples/sites/src/views/components/components.vue
+++ b/examples/sites/src/views/components/components.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- 一个组件的文档:  描述md + demos + apis -->
-  <header class="flex-horizontal docs-header">
+  <header :class="['flex-horizontal', 'docs-header', cmpId === 'loading' && 'docs-header-highlight']">
     <div class="docs-title-wrap">
       <div class="markdown-body markdown-top-body" size="medium" v-html="cmpTopMd"></div>
       <version-tip
@@ -95,7 +95,13 @@
               </div>
             </div>
           </div>
-          <tiny-tabs v-else v-model="activeTab" ref="demoTabs" class="docs-content-tabs" @click="onTabsClick">
+          <tiny-tabs
+            v-else
+            v-model="activeTab"
+            ref="demoTabs"
+            :class="['docs-content-tabs', cmpId === 'loading' && 'docs-content-tabs-highlight']"
+            @click="onTabsClick"
+          >
             <tiny-tab-item :title="i18nByKey('demos')" name="demos">
               <!-- demos列表 -->
               <template v-if="currJson?.demos?.length">
@@ -769,6 +775,10 @@ export default defineComponent({
   background-color: #fff;
   box-shadow: 12px 0 20px 6px rgba(0, 0, 0, 0.06);
 
+  &.docs-header-highlight {
+    z-index: var(--docs-header-zindex-highlight);
+  }
+
   .docs-title-wrap {
     flex: 1;
     min-width: var(--layout-content-main-min-width);
@@ -817,6 +827,10 @@ export default defineComponent({
     --tv-Tabs-header-font-active-text-color: #2f5bea;
     --tv-Tabs-item-active-border-color: #2f5bea;
 
+    &.docs-content-tabs-highlight :deep(.tiny-tabs__header) {
+      z-index: var(--docs-layout-sider-zindex-highlight);
+    }
+
     flex: 1;
     transition: all ease-in-out 0.3s;
     min-width: var(--layout-content-main-min-width);