diff --git a/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_lg.png b/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_lg.png
index 77dafcbf0f5188a84eb4204cd92253fb8701c53f..d3ea924476d291188cd1e4971af5dc5e49472cce 100644
Binary files a/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_lg.png and b/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_lg.png differ
diff --git a/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_md.png b/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_md.png
index 5d93b49a1c0082adecbf98f8ecab0919dedbdc2a..acc469c17491f6dfe60070e0092c71e23e7642e0 100644
Binary files a/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_md.png and b/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_md.png differ
diff --git a/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_sm.png b/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_sm.png
index 3f00485d41bd4d22c5eb68301eb184bf8befb341..4f0688a44f0e5dd10bdf9e42fb272a30441b51f8 100644
Binary files a/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_sm.png and b/zh-cn/application-dev/key-features/multi-device-app-dev/figures/tripleColumn_sm.png differ
diff --git a/zh-cn/application-dev/key-features/multi-device-app-dev/typical-layout-scenario.md b/zh-cn/application-dev/key-features/multi-device-app-dev/typical-layout-scenario.md
index 0eede0cfc6223ef2ca3d8a41211f3ae7d7d4eaf6..78e8fced82673e71ce3a09a726d46a10124a7621 100644
--- a/zh-cn/application-dev/key-features/multi-device-app-dev/typical-layout-scenario.md
+++ b/zh-cn/application-dev/key-features/multi-device-app-dev/typical-layout-scenario.md
@@ -512,7 +512,7 @@ struct NavigationSample {
 
 **实现方案**
 
-三分栏场景可以组合使用[SideBarContainer](../../reference/arkui-ts/ts-container-sidebarcontainer.md)组件与[Navigation组件](../../reference/arkui-ts/ts-basic-components-navigation.md)实现，SideBarContainer组件可以通过侧边栏控制按钮控制显示/隐藏，Navigation组件可以根据窗口宽度自动切换该组件内单/双栏显示，详情可参考[NavigationMode](../../reference/arkui-ts/ts-basic-components-navigation.md#navigationmode枚举说明)的属性。
+三分栏场景可以组合使用[SideBarContainer](../../reference/arkui-ts/ts-container-sidebarcontainer.md)组件与[Navigation组件](../../reference/arkui-ts/ts-basic-components-navigation.md)实现，SideBarContainer组件可以通过侧边栏控制按钮控制显示/隐藏，Navigation组件可以根据窗口宽度自动切换该组件内单/双栏显示，结合响应式布局能力，在不同断点下为SiderBarConContainer组件的sideBarWidth、minContentWidth与Navigation组件的navBarWidth、minContentWidth等属性配置不同的值，即可实现目标效果。
 
 **参考代码**
 
@@ -547,12 +547,13 @@ struct Item {
         .textAlign(TextAlign.Center)
         .width('100%')
         .height('30%')
-        .margin(10)
       NavDestination() {
         Details({imageSrc: this.imageSrc})
       }.title(this.label)
+      .hideTitleBar(false)
       .backgroundColor('#FFFFFF')
     }
+    .margin(10)
   }
 }
 
@@ -609,12 +610,12 @@ struct TripleColumnSample {
         .navBarWidth(240)
         .hideToolBar(true)
         .title(this.NavigationTitle)
-        .minContextWidth(600-240)
+        .minContentWidth(600-240)
       }.width('100%').height('100%')
     }.sideBarWidth(240)
     .minSideBarWidth(50)
     .maxSideBarWidth(300)
-    .minContextWidth(600-240)
+    .minContentWidth(840-240)
   }
 }
 ```