diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/listItem3.jpeg b/zh-cn/application-dev/reference/arkui-ts/figures/listItem3.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..5188c9221033fb57e3e483ade647353097f9e4e4
Binary files /dev/null and b/zh-cn/application-dev/reference/arkui-ts/figures/listItem3.jpeg differ
diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/listItemGroup2.jpeg b/zh-cn/application-dev/reference/arkui-ts/figures/listItemGroup2.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..4b85118fd80799129e19f376e601eaa6b9aa799f
Binary files /dev/null and b/zh-cn/application-dev/reference/arkui-ts/figures/listItemGroup2.jpeg differ
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
index 5387dc32f051433332c2d3cdfd94dc6e267138c0..78cb06ee049134bc9fd87a72a02fc1af3db7e37d 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
@@ -192,3 +192,42 @@ struct ListItemExample2 {
 }
 ```
 ![deleteListItem](figures/deleteListItem.gif)
+
+## 示例3
+```ts
+// xxx.ets
+@Entry
+@Component
+struct ListItemExample3 {
+ private arr: any = [ListItemStyle.CARD, ListItemStyle.CARD,ListItemStyle.NONE]
+ build() {
+  Column() {
+   List({ space: "4vp", initialIndex: 0 }) {
+    ListItemGroup({style:ListItemGroupStyle.CARD}){
+     ForEach(this.arr, (itemStyle,index) => {
+      ListItem({style:itemStyle}) {
+       Text(""+index)
+        .width("100%")
+        .textAlign(TextAlign.Center)
+      }
+     })
+    }
+    ForEach(this.arr, (itemStyle,index) => {
+     ListItem({style:itemStyle}) {
+      Text(""+index)
+       .width("100%")
+       .textAlign(TextAlign.Center)
+     }
+    })
+   }
+   .width('100%')
+   .multiSelectable(true)
+   .backgroundColor(0xDCDCDC) // 浅蓝色的List
+  }
+  .width('100%')
+  .padding({ top: 5 })
+ }
+}
+
+```
+![ListItemStyle](figures/listItem3.jpeg)
\ No newline at end of file
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitemgroup.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitemgroup.md
index 25d2c094bb7abd793f8dbc721c72bc407c63736e..dedf78ea7e1ca835a65c4167fb92f7a7c193aadf 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitemgroup.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitemgroup.md
@@ -119,3 +119,55 @@ struct ListItemGroupExample {
 ```
 
 ![zh-cn_image_0000001219864159](figures/zh-cn_image_listitemgroup.gif)
+
+- 示例2
+
+```ts
+// xxx.ets
+@Entry
+@Component
+struct ListItemGroupExample2 {
+ private arr: any = [
+  {
+   style:ListItemGroupStyle.CARD,
+   itemStyles:[ListItemStyle.CARD, ListItemStyle.CARD, ListItemStyle.CARD]
+  },
+  {
+   style:ListItemGroupStyle.CARD,
+   itemStyles:[ListItemStyle.CARD, ListItemStyle.CARD, ListItemStyle.NONE]
+  },
+  {
+   style:ListItemGroupStyle.CARD,
+   itemStyles:[ListItemStyle.CARD, ListItemStyle.NONE, ListItemStyle.CARD]
+  },
+  {
+   style:ListItemGroupStyle.NONE,
+   itemStyles:[ListItemStyle.CARD, ListItemStyle.CARD, ListItemStyle.NONE]
+  }
+ ]
+ build() {
+  Column() {
+   List({ space: "4vp", initialIndex: 0 }) {
+    ForEach(this.arr, (item,index) => {
+     ListItemGroup({ style:item.style }) {
+      ForEach(item.itemStyles, (itemStyle,itemIndex) => {
+       ListItem({style:itemStyle}) {
+        Text("第"+(index+1)+"个Group中第"+(itemIndex+1)+"个item")
+         .width("100%")
+         .textAlign(TextAlign.Center)
+       }
+      }, item => item)
+     }
+    })
+   }
+   .width('100%')
+   .multiSelectable(true)
+   .backgroundColor(0xDCDCDC) // 浅蓝色的List
+  }
+  .width('100%')
+  .padding({ top: 5 })
+ }
+}
+
+```
+![ListItemGroupStyle](figures/listItemGroup2.jpeg)
\ No newline at end of file