diff --git a/en/application-dev/reference/arkui-ts/ts-container-panel.md b/en/application-dev/reference/arkui-ts/ts-container-panel.md
index a73447518e43234f226ca322d04418858f1df2da..cf8216f8ed669691ad0c1968c3e052fd3ed38ef2 100644
--- a/en/application-dev/reference/arkui-ts/ts-container-panel.md
+++ b/en/application-dev/reference/arkui-ts/ts-container-panel.md
@@ -1,8 +1,8 @@
 # Panel
 
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
-> This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**<br/>This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
+>
 
 
 The **&lt;Panel&gt;** component is a slidable panel that presents lightweight content with flexible sizes. It is a pop-up component.
@@ -22,43 +22,43 @@ This component can contain child components.
 
 Panel(value:{show:boolean})
 
-- Parameter
-    | Name | Type | Mandatory | Default Value | Description | 
+- Parameters
+    | Name | Type | Mandatory | Default Value | Description |
   | -------- | -------- | -------- | -------- | -------- |
-  | show | boolean | Yes | - | Whether the panel is shown or hidden. | 
+  | show | boolean | Yes | - | Whether the panel is shown or hidden. |
 
 
 ## Attributes
 
-  | Name | Type | Default Value | Description | 
+| Name | Type | Default Value | Description |
 | -------- | -------- | -------- | -------- |
-| type | PanelType | PanelType.Foldable | Type of the panel. | 
-| mode | PanelMode | - | Initial status of the panel. | 
-| dragBar | boolean | true | Whether to enable a drag bar. The value **true** means that the drag bar will be displayed, and **false** means the opposite. | 
-| fullHeight | Length | - | Panel height in the **PanelMode.Full** mode. | 
-| halfHeight | Length | - | Panel height in the **PanelMode.Half** mode. The default value is half of the screen height. | 
-| miniHeight | Length | - | Panel height in the **PanelMode.Mini** mode. | 
+| type | PanelType | PanelType.Foldable | Type of the panel. |
+| mode | PanelMode | - | Initial status of the panel. |
+| dragBar | boolean | true | Whether to enable a drag bar. The value **true** means that the drag bar will be displayed, and **false** means the opposite. |
+| fullHeight | Length | - | Panel height in the **PanelMode.Full** mode. |
+| halfHeight | Length | - | Panel height in the **PanelMode.Half** mode. The default value is half of the screen height. |
+| miniHeight | Length | - | Panel height in the **PanelMode.Mini** mode. |
 
 - PanelType enums
-    | Name | Description | 
+    | Name | Description |
   | -------- | -------- |
-  | Minibar | A minibar panel displays content in the minibar area or a large (fullscreen-like) area. | 
-  | Foldable | A foldable panel displays permanent content in a large (fullscreen-like), medium-sized (halfscreen-like), or small area. | 
-  | Temporary | A temporary panel displays content in a large (fullscreen-like) or medium-sized (halfscreen-like) area. | 
+  | Minibar | A minibar panel displays content in the minibar area or a large (fullscreen-like) area. |
+  | Foldable | A foldable panel displays permanent content in a large (fullscreen-like), medium-sized (halfscreen-like), or small area. |
+  | Temporary | A temporary panel displays content in a large (fullscreen-like) or medium-sized (halfscreen-like) area. |
 
 - PanelMode enums
-    | Name | Description | 
+    | Name | Description |
   | -------- | -------- |
-  | Mini | Displays a **minibar** or **foldable** panel in its minimum size. This attribute does not take effect for **temporary** panels. | 
-  | Half | Displays a **foldable** or **temporary** panel in a medium-sized (halfscreen-like) area. This attribute does not take effect for **minibar** panels. | 
-  | Full | Displays a panel in a large (fullscreen-like) area. | 
+  | Mini | Displays a **minibar** or **foldable** panel in its minimum size. This attribute does not take effect for **temporary** panels. |
+  | Half | Displays a **foldable** or **temporary** panel in a medium-sized (halfscreen-like) area. This attribute does not take effect for **minibar** panels. |
+  | Full | Displays a panel in a large (fullscreen-like) area. |
 
 
 ## Events
 
-  | Name | Description | 
+| Name | Description |
 | -------- | -------- |
-| onChange(callback: (width: number, height: number, mode: PanelMode) =&gt; void) | Triggered when the status of the panel changes. The returned height value is the height of the content area. When the value of **dragbar** is **true**, the height of the panel is the dragbar height plus the height of the content area. | 
+| onChange(callback: (width: number, height: number, mode: PanelMode) =&gt; void) | Triggered when the status of the panel changes. The returned height value is the height of the content area. When the value of **dragbar** is **true**, the height of the panel is the drag bar height plus the height of the content area. |
 
 
 ## Example
@@ -86,10 +86,10 @@ struct PanelExample {
         }
       }
       .type(PanelType.Foldable).mode(PanelMode.Half)
-      .dragBar(true) // The dragbar is enabled by default.
-      .halfHeight(500) // Half of the height by default
-      .onChange((value: any) => {
-        console.info(`width:${value.width},height:${value.height},mode:${value.mode}`)
+      .dragBar(true) // The drag bar is enabled by default.
+      .halfHeight(500) // The default value is half of the screen height.
+      .onChange((width: number, height: number, mode: PanelMode) => {
+        console.info(`width:${width},height:${height},mode:${mode}`)
       })
     }.width('100%').height('100%').backgroundColor(0xDCDCDC).padding({ top: 5 })
   }