update docs

Signed-off-by: NHelloCrease <lian15@huawei.com>

zh-cn/application-dev/reference/arkui-ts/ts-animatorproperty.md

 # 属性动画
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 组件的通用属性发生变化时，可以创建属性动画进行渐变，提升用户体验。
 
+>  **说明：**
+>
+>  从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 | 名称         | 参数类型                                     | 默认值             | 描述                      |
-| -------- | -------- | -------- | -------- |
+| ---------- | ---------------------------------------- | --------------- | ----------------------- |
 | duration   | number                                   | 1000            | 单位为毫秒，默认动画时长为1000毫秒。    |
 | curve      | Curve                                    | Curve.Linear    | 默认曲线为线性。                |
 | delay      | number                                   | 0               | 单位为毫秒，默认不延时播放。          |
 | iterations | number                                   | 1               | 默认播放一次，设置为-1时表示无限次播放。   |
 | playMode   | [PlayMode](ts-appendix-enums.md#playmode枚举值说明) | PlayMode.Normal | 设置动画播放模式，默认播放完成后重头开始播放。 |
 
+## Curve枚举说明
 
-- Curve枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Linear | 表示动画从头到尾的速度都是相同的。 | 
-  | Ease | 表示动画以低速开始，然后加快，在结束前变慢，CubicBezier(0.25, 0.1, 0.25, 1.0)。 | 
-  | EaseIn | 表示动画以低速开始，CubicBezier(0.42, 0.0, 1.0, 1.0)。 | 
-  | EaseOut | 表示动画以低速结束，CubicBezier(0.0, 0.0, 0.58, 1.0)。 | 
-  | EaseInOut | 表示动画以低速开始和结束，CubicBezier(0.42, 0.0, 0.58, 1.0)。 | 
-  | FastOutSlowIn | 标准曲线，cubic-bezier(0.4, 0.0, 0.2, 1.0)。 | 
-  | LinearOutSlowIn | 减速曲线，cubic-bezier(0.0, 0.0, 0.2, 1.0)。 | 
-  | FastOutLinearIn | 加速曲线，cubic-bezier(0.4, 0.0, 1.0, 1.0)。 | 
-  | ExtremeDeceleration | 急缓曲线，cubic-bezier(0.0, 0.0, 0.0, 1.0)。 | 
-  | Sharp | 锐利曲线，cubic-bezier(0.33, 0.0, 0.67, 1.0)。 | 
-  | Rhythm | 节奏曲线，cubic-bezier(0.7, 0.0, 0.2, 1.0)。 | 
-  | Smooth | 平滑曲线，cubic-bezier(0.4, 0.0, 0.4, 1.0)。 | 
-  | Friction | 阻尼曲线，CubicBezier(0.2, 0.0, 0.2, 1.0)。 | 
-
+| 名称                  | 描述                                       |
+| ------------------- | ---------------------------------------- |
+| Linear              | 表示动画从头到尾的速度都是相同的。                        |
+| Ease                | 表示动画以低速开始，然后加快，在结束前变慢，CubicBezier(0.25, 0.1, 0.25, 1.0)。 |
+| EaseIn              | 表示动画以低速开始，CubicBezier(0.42, 0.0, 1.0, 1.0)。 |
+| EaseOut             | 表示动画以低速结束，CubicBezier(0.0, 0.0, 0.58, 1.0)。 |
+| EaseInOut           | 表示动画以低速开始和结束，CubicBezier(0.42, 0.0, 0.58, 1.0)。 |
+| FastOutSlowIn       | 标准曲线，cubic-bezier(0.4, 0.0, 0.2, 1.0)。 |
+| LinearOutSlowIn     | 减速曲线，cubic-bezier(0.0, 0.0, 0.2, 1.0)。 |
+| FastOutLinearIn     | 加速曲线，cubic-bezier(0.4, 0.0, 1.0, 1.0)。 |
+| ExtremeDeceleration | 急缓曲线，cubic-bezier(0.0, 0.0, 0.0, 1.0)。 |
+| Sharp               | 锐利曲线，cubic-bezier(0.33, 0.0, 0.67, 1.0)。 |
+| Rhythm              | 节奏曲线，cubic-bezier(0.7, 0.0, 0.2, 1.0)。 |
+| Smooth              | 平滑曲线，cubic-bezier(0.4, 0.0, 0.4, 1.0)。 |
+| Friction            | 阻尼曲线，CubicBezier(0.2, 0.0, 0.2, 1.0)。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct AttrAnimationExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-blank.md

 # Blank
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 空白填充组件，在容器主轴方向上，空白填充组件具有自动填充容器空余部分的能力。仅当父组件为Row/Column时生效。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,25 +21,27 @@
 
 Blank(min?:  Length)
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | min | Length | 否 | 0 | 空白填充组件在容器主轴上的最小大小。 | 
+**参数：** 
 
+| 参数名  | 参数类型   | 必填   | 默认值  | 参数描述               |
+| ---- | ------ | ---- | ---- | ------------------ |
+| min  | Length | 否    | 0    | 空白填充组件在容器主轴上的最小大小。 |
 
 ## 属性
 
 | 名称    | 参数类型  | 默认值        | 描述           |
-| -------- | -------- | -------- | -------- |
+| ----- | ----- | ---------- | ------------ |
 | color | Color | 0x00000000 | 设置空白填充的填充颜色。 |
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> - 不支持通用属性方法。
+>  **说明：**
+>
+>  不支持通用属性方法。
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct BlankExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-button.md

 # Button
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 提供按钮组件。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 ## 权限列表
 
@@ -19,43 +18,42 @@
 
 ## 接口
 
-- Button(options?: {type?: ButtonType, stateEffect?: boolean})
+**方法1：** Button(options?: {type?: ButtonType, stateEffect?: boolean})
 
-  **表1** options参数说明
+表1 options参数说明
 
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | type | ButtonType | 否 | Capsule | 描述按钮风格。 | 
-  | stateEffect | boolean | 否 | true | 按钮按下时是否开启切换效果，当状态置为false时，点击效果关闭。 | 
+| 参数名         | 参数类型       | 必填   | 默认值     | 参数描述                              |
+| ----------- | ---------- | ---- | ------- | --------------------------------- |
+| type        | ButtonType | 否    | Capsule | 描述按钮风格。                           |
+| stateEffect | boolean    | 否    | true    | 按钮按下时是否开启切换效果，当状态置为false时，点击效果关闭。 |
 
+**方法2：** Button(label?: string, options?: { type?: ButtonType, stateEffect?: boolean })
 
-- Button(label?: string, options?: { type?: ButtonType, stateEffect?: boolean })
+使用文本内容创建相应的按钮组件，此时Button无法包含子组件。
 
-  使用文本内容创建相应的按钮组件，此时Button无法包含子组件。
-
-  **表2** value参数说明
-  
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | label | string | 否 | - | 按钮文本内容。 |
-  | options | Object | 否 | - | 见options参数说明。 |
+表2 value参数说明
 
+| 参数名     | 参数类型   | 必填   | 默认值  | 参数描述          |
+| ------- | ------ | ---- | ---- | ------------- |
+| label   | string | 否    | -    | 按钮文本内容。       |
+| options | Object | 否    | -    | 见options参数说明。 |
 
 ## 属性
 
 | 名称          | 参数类型       | 默认值     | 描述                                |
-| -------- | -------- | -------- | -------- |
+| ----------- | ---------- | ------- | --------------------------------- |
 | type        | ButtonType | Capsule | 设置Button样式。                       |
 | stateEffect | boolean    | true    | 状态切换时是否开启切换效果，当状态置为false时，点击效果关闭。 |
 
-- ButtonType枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Capsule | 胶囊型按钮（圆角默认为高度的一半）。 | 
-  | Circle | 圆形按钮。 | 
-  | Normal | 普通按钮（默认不带圆角）。 | 
+## ButtonType枚举说明
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+| 名称      | 描述                 |
+| ------- | ------------------ |
+| Capsule | 胶囊型按钮（圆角默认为高度的一半）。 |
+| Circle  | 圆形按钮。              |
+| Normal  | 普通按钮（默认不带圆角）。      |
+
+>  **说明：**
 >  - 按钮圆角通过[通用属性borderRadius设置](ts-universal-attributes-border.md)（不支持通过border接口设置圆角）。
 >  - 当按钮类型为Capsule时，borderRadius设置不生效，按钮圆角始终为高度的一半。
 >  - 当按钮类型为Circle时，borderRadius即为按钮半径，若未设置borderRadius按钮半径则为宽、高中较小值的一半。
@@ -64,7 +62,8 @@
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ButtonExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-checkbox.md

 # Checkbox
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 提供多选框组件，通常用于某选项的打开或关闭。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 ## 权限列表
 
 无
@@ -18,30 +18,30 @@
 
 Checkbox( name?: string,  group?: string )
 
-- 参数
-  | 参数名  | 参数类型 | 必填  | 默认值 | 参数描述 |
-  | --------| --------| ------ | -------- | -------- |
-  | name    | string | 否 | - | 多选框名称。 |
-  | group   | string | 否 | - | 多选框的群组名称。 |
+**参数：** 
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述      |
+| ----- | ------ | ---- | ---- | --------- |
+| name  | string | 否    | -    | 多选框名称。    |
+| group | string | 否    | -    | 多选框的群组名称。 |
 
 ## 属性
 
-
 | 名称            | 参数类型  | 默认值   | 描述           |
-| ------------- | ------- | ------ | -------- |
+| ------------- | ----- | ----- | ------------ |
 | select        | bool  | false | 设置多选框是否选中。   |
 | selectedColor | Color | -     | 设置多选框选中状态颜色。 |
 
 ## 事件
 
 | 名称                                       | 功能描述                                     |
-| ----------| -------- |
-|onChange(callback: (value: boolean) => void) | 当选中状态发生变化时，触发该回调。<br>- value为true时，表示已选中。<br>- value为false时，表示未选中。 | 
+| ---------------------------------------- | ---------------------------------------- |
+| onChange(callback: (value: boolean) => void) | 当选中状态发生变化时，触发该回调。<br>- value为true时，表示已选中。<br>- value为false时，表示未选中。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct CheckboxExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-checkboxgroup.md

 # CheckboxGroup
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
 多选框群组，用于控制多选框全选或者不全选状态。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 ## 权限列表
 
 无
@@ -19,36 +20,37 @@ CheckboxGroup( group?: string )
 
 创建多选框群组，可以控制群组内的Checkbox全选或者不全选，相同group的Checkbox和CheckboxGroup为同一群组。
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | group | string | 否 | - | 群组名称。|
+**参数：**
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述  |
+| ----- | ------ | ---- | ---- | ----- |
+| group | string | 否    | -    | 群组名称。 |
 
 ## 属性
 
 | 名称            | 参数类型  | 默认值   | 描述               |
-| -------- | -------- | -------- | -------- |
+| ------------- | ----- | ----- | ---------------- |
 | selectAll     | bool  | false | 设置是否全选。          |
 | selectedColor | Color | -     | 设置被选中或部分选中状态的颜色。 |
 
 ## 事件
 
 | 名称                                       | 功能描述                                     |
-| -------- | -------- |
-| onChange (callback: (names: Array&lt;string&gt;, status: SelectStatus) => void ) |CheckboxGroup的选中状态或群组内的Checkbox的选中状态发生变化时，触发回调。<br>- names：群组内所有被选中的多选框名称。<br>- status：选中状态。| 
+| ---------------------------------------- | ---------------------------------------- |
+| onChange (callback: (names: Array&lt;string&gt;, status: SelectStatus) => void ) | CheckboxGroup的选中状态或群组内的Checkbox的选中状态发生变化时，触发回调。<br>- names：群组内所有被选中的多选框名称。<br>- status：选中状态。 |
 
-- SelectStatus枚举说明
-  | 名称  | 描述 | 
-  | ----- | -------------------- |
-  | All   | 群组多选择框全部选择。 |
-  | Part  | 群组多选择框部分选择。 |
-  | None  | 群组多选择框全部没有选择。 |
+## SelectStatus枚举说明
 
+| 名称   | 描述            |
+| ---- | ------------- |
+| All  | 群组多选择框全部选择。   |
+| Part | 群组多选择框部分选择。   |
+| None | 群组多选择框全部没有选择。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct CheckboxExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datapanel.md

@@ -2,39 +2,37 @@
 
 数据面板组件，用于将多个数据占比情况使用占比图进行展示。
 
-
 ## 权限列表
 
 无
 
-
 ## 子组件
 
 无
 
-
 ## 接口
 
 DataPanel(value:{values: number[], max?: number, type?: DataPanelType})
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | values | number[] | 是 | - | 数据值列表，最大支持9个数据。 |
-  | max | number | 否 | 100 | -&nbsp;max大于0，表示数据的最大值。<br/>-&nbsp;max小于等于0，max等于value数组各项的和，按比例显示。 |
-  | type<sup>8+</sup> | DataPanelType | 否 | DataPanelType.Circle | 数据面板的类型。 |
+**参数**: 
 
+| 参数名               | 参数类型          | 必填   | 默认值                  | 参数描述                                     |
+| ----------------- | ------------- | ---- | -------------------- | ---------------------------------------- |
+| values            | number[]      | 是    | -                    | 数据值列表，最大支持9个数据。                          |
+| max               | number        | 否    | 100                  | -&nbsp;max大于0，表示数据的最大值。<br/>-&nbsp;max小于等于0，max等于value数组各项的和，按比例显示。 |
+| type<sup>8+</sup> | DataPanelType | 否    | DataPanelType.Circle | 数据面板的类型。                                 |
 
-- DataPanelType枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Line | 线型数据面板。 | 
-  | Circle | 环形数据面板。 |
+## DataPanelType枚举说明
 
+| 名称     | 描述      |
+| ------ | ------- |
+| Line   | 线型数据面板。 |
+| Circle | 环形数据面板。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct DataPanelExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md

 # DatePicker
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 选择日期的滑动选择器组件。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 ## 权限列表
 
 无
 
-
 ## 子组件
 
 无
 
-
 ## 接口
 
 DatePicker(options?: DatePickerOptions)
 
 根据指定范围的Date创建可以选择日期的滑动选择器。
 
-- options参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | start | Date | 否 | Date('1970-1-1') | 指定选择器的起始日期。 |
-  | end | Date | 否 | Date('2100-12-31') | 指定选择器的结束日期。 |
-  | selected | Date | 否 | 当前系统日期 | 设置选中项的日期。 |
+**options参数:**
 
+| 参数名      | 参数类型 | 必填   | 默认值                | 参数描述        |
+| -------- | ---- | ---- | ------------------ | ----------- |
+| start    | Date | 否    | Date('1970-1-1')   | 指定选择器的起始日期。 |
+| end      | Date | 否    | Date('2100-12-31') | 指定选择器的结束日期。 |
+| selected | Date | 否    | 当前系统日期             | 设置选中项的日期。   |
 
 ## 属性
 
 | 名称    | 参数类型    | 默认值   | 描述                                       |
-| -------- | -------- | -------- | -------- |
+| ----- | ------- | ----- | ---------------------------------------- |
 | lunar | boolean | false | 日期是否显示农历。<br/>-&nbsp;true：展示农历。<br/>-&nbsp;false：不展示农历。 |
 
-
 ## 事件
 
 | 名称                                       | 功能描述        |
-| -------- | -------- | 
+| ---------------------------------------- | ----------- |
 | onChange(callback:&nbsp;(value:&nbsp;DatePickerResult)&nbsp;=&gt;&nbsp;void) | 选择日期时触发该事件。 |
 
 ### DatePickerResult对象说明
-  | 名称 | 参数类型 | 描述 | 
-  | -------- | -------- | -------- |
-  | year | number | 选中日期的年。 | 
-  | month | number | 选中日期的月(0~11)，0表示1月，11表示12月。 | 
-  | day | number | 选中日期的日。 | 
+| 名称    | 参数类型   | 描述                          |
+| ----- | ------ | --------------------------- |
+| year  | number | 选中日期的年。                     |
+| month | number | 选中日期的月(0~11)，0表示1月，11表示12月。 |
+| day   | number | 选中日期的日。                     |
 
 
 ## 示例
@@ -57,7 +53,8 @@ DatePicker(options?: DatePickerOptions)
 
 ### 日期选择器（显示农历）
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct DatePickerExample01 {
@@ -84,7 +81,8 @@ struct DatePickerExample01 {
 
 ### 日期选择器（不显示农历）
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct DatePickerExample02 {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-divider.md

 # Divider
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 提供分隔器组件，分隔不同内容块/内容元素。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 ## 权限列表
 
 无
 
-
 ## 子组件
 
 无
 
-
 ## 接口
 
 Divider()
 
-
 ## 属性
 
 | 名称          | 参数类型                                     | 默认值               | 描述                                       |
-| -------- | -------- | -------- | -------- |
+| ----------- | ---------------------------------------- | ----------------- | ---------------------------------------- |
 | vertical    | boolean                                  | false             | 使用水平分割线还是垂直分割线，false: 水平分割线， true:垂直分割线。 |
 | color       | Color                                    | -                 | 设置分割线颜色。                                 |
 | strokeWidth | Length                                   | 1                 | 设置分割线宽度。                                 |
@@ -36,10 +32,10 @@ Divider()
 
 不支持通用事件。
 
-
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct DividerExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-gauge.md

 # Gauge
 
-
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 数据量规图表组件，用于将数据展示为环形图表。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 ## 权限列表
 
 无
 
-
 ## 子组件
 
 无
 
-
 ## 接口
 
 Gauge(value:{value: number, min?: number, max?: number})
 
-- 参数
-    | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | number | 是 | - | 当前数据值。 | 
-  | min | number | 否 | 0 | 当前数据段最小值。 | 
-  | max | number | 否 | 100 | 当前数据段最大值。 | 
+**参数：**
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述      |
+| ----- | ------ | ---- | ---- | --------- |
+| value | number | 是    | -    | 当前数据值。    |
+| min   | number | 否    | 0    | 当前数据段最小值。 |
+| max   | number | 否    | 100  | 当前数据段最大值。 |
 
 ## 属性
 
-  | 名称 | 参数类型 | 默认值 | 描述 | 
-| -------- | -------- | -------- | -------- |
+| 名称          | 参数类型                                     | 默认值  | 描述                          |
+| ----------- | ---------------------------------------- | ---- | --------------------------- |
 | value       | number                                   | 0    | 设置当前数据图表的值。                 |
 | startAngle  | Angle                                    | -150 | 设置起始角度位置，时钟0点为0度，顺时针方向为正角度。 |
 | endAngle    | Angle                                    | 150  | 设置终止角度位置，时钟0点为0度，顺时针方向为正角度。 |
@@ -44,7 +40,8 @@ Gauge(value:{value: number, min?: number, max?: number})
 ## 示例
 
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct GaugeExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md

 # Image
 
+图片组件，用来渲染展示图片。
+
 >  **说明：**
 >
 >  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
-图片组件，用来渲染展示图片。
-
-
 ## 权限说明
 
 使用网络图片时，需要在config.json文件对应的"abilities"中添加网络使用权限ohos.permission.INTERNET。
@@ -32,11 +31,11 @@
 
 Image(src: string | PixelMap | Resource)
 
-- 参数
-  | 参数名  | 参数类型                                     | 必填   | 默认值  | 参数描述                                     |
-  | ---- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
-  | src  | string\|&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)\|&nbsp;[Resource](../../ui/ts-types.md#resource类型) | 是    | -    | 图片的数据源，支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时，例如`Image("common/test.jpg")`，不支持该Image组件被跨包/跨模块调用，建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]`为`Base64`字符串数据。<br/>\- 支持`dataability://`路径前缀的字符串，用于访问通过data&nbsp;ability提供的图片路径。 |
+**参数：**
 
+| 参数名  | 参数类型                                     | 必填   | 默认值  | 参数描述                                     |
+| ---- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
+| src  | string\|&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)\|&nbsp;[Resource](../../ui/ts-types.md#resource类型) | 是    | -    | 图片的数据源，支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时，例如`Image("common/test.jpg")`，不支持该Image组件被跨包/跨模块调用，建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]`为`Base64`字符串数据。<br/>\- 支持`dataability://`路径前缀的字符串，用于访问通过data&nbsp;ability提供的图片路径。 |
 
 ## 属性
 
@@ -44,35 +43,37 @@ Image(src: string | PixelMap | Resource)
 | --------------------- | ---------------------------------------- | -------- | ---------------------------------------- |
 | alt                   | string \| [Resource](../../ui/ts-types.md#resource类型) | -        | 加载时显示的占位图。支持本地图片和网络路径。                   |
 | objectFit             | ImageFit                                 | Cover    | 设置图片的缩放类型。                               |
-| objectRepeat          | [ImageRepeat](ts-appendix-enums.md#imagerepeat枚举说明) | NoRepeat | 设置图片的重复样式。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;-&nbsp;svg类型图源不支持该属性。 |
-| interpolation         | ImageInterpolation                       | None     | 设置图片的插值效果，仅针对图片放大插值。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;-&nbsp;svg类型图源不支持该属性。<br/>>&nbsp;-&nbsp;PixelMap资源不支持该属性。 |
-| renderMode            | ImageRenderMode                          | Original | 设置图片渲染的模式。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;-&nbsp;svg类型图源不支持该属性。 |
-| sourceSize            | {<br/>width:&nbsp;number,<br/>height:&nbsp;number<br/>} | -        | 设置图片解码尺寸，将原始图片解码成指定尺寸的图片，number类型单位为px。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;-&nbsp;PixelMap资源不支持该属性。 |
+| objectRepeat          | [ImageRepeat](ts-appendix-enums.md#imagerepeat枚举说明) | NoRepeat | 设置图片的重复样式。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;-&nbsp;svg类型图源不支持该属性。 |
+| interpolation         | ImageInterpolation                       | None     | 设置图片的插值效果，仅针对图片放大插值。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;-&nbsp;svg类型图源不支持该属性。<br/>>&nbsp;-&nbsp;PixelMap资源不支持该属性。 |
+| renderMode            | ImageRenderMode                          | Original | 设置图片渲染的模式。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;-&nbsp;svg类型图源不支持该属性。 |
+| sourceSize            | {<br/>width:&nbsp;number,<br/>height:&nbsp;number<br/>} | -        | 设置图片解码尺寸，将原始图片解码成指定尺寸的图片，number类型单位为px。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;-&nbsp;PixelMap资源不支持该属性。 |
 | syncLoad<sup>8+</sup> | boolean                                  | false    | 设置是否同步加载图片，默认是异步加载。同步加载时阻塞UI线程，不会显示占位图。  |
 
-- ImageFit枚举说明
-  | 名称        | 描述                               |
-  | --------- | -------------------------------- |
-  | Cover     | 保持宽高比进行缩小或者放大，使得图片两边都大于或等于显示边界。  |
-  | Contain   | 保持宽高比进行缩小或者放大，使得图片完全显示在显示边界内。    |
-  | Fill      | 不保持宽高比进行放大缩小，使得图片填充满显示边界。        |
-  | None      | 保持原有尺寸显示。通常配合objectRepeat属性一起使用。 |
-  | ScaleDown | 保持宽高比显示，图片缩小或者保持不变。              |
-
-- ImageInterpolation枚举说明
-  | 名称     | 描述                       |
-  | ------ | ------------------------ |
-  | None   | 不使用插值图片数据。               |
-  | High   | 高度使用插值图片数据，可能会影响图片渲染的速度。 |
-  | Medium | 中度使用插值图片数据。              |
-  | Low    | 低度使用插值图片数据。              |
-
-- ImageRenderMode枚举说明
-  | 名称       | 描述                    |
-  | -------- | --------------------- |
-  | Original | 按照原图进行渲染，包括颜色。        |
-  | Template | 将图像渲染为模板图像，忽略图片的颜色信息。 |
+## ImageFit枚举说明
+
+| 名称        | 描述                               |
+| --------- | -------------------------------- |
+| Cover     | 保持宽高比进行缩小或者放大，使得图片两边都大于或等于显示边界。  |
+| Contain   | 保持宽高比进行缩小或者放大，使得图片完全显示在显示边界内。    |
+| Fill      | 不保持宽高比进行放大缩小，使得图片填充满显示边界。        |
+| None      | 保持原有尺寸显示。通常配合objectRepeat属性一起使用。 |
+| ScaleDown | 保持宽高比显示，图片缩小或者保持不变。              |
 
+## ImageInterpolation枚举说明
+
+| 名称     | 描述                       |
+| ------ | ------------------------ |
+| None   | 不使用插值图片数据。               |
+| High   | 高度使用插值图片数据，可能会影响图片渲染的速度。 |
+| Medium | 中度使用插值图片数据。              |
+| Low    | 低度使用插值图片数据。              |
+
+## ImageRenderMode枚举说明
+
+| 名称       | 描述                    |
+| -------- | --------------------- |
+| Original | 按照原图进行渲染，包括颜色。        |
+| Template | 将图像渲染为模板图像，忽略图片的颜色信息。 |
 
 ## 事件
 
@@ -85,7 +86,7 @@ Image(src: string | PixelMap | Resource)
 
 ## 示例
 
-```
+```ts
 // Image1
 @Entry
 @Component
@@ -152,7 +153,7 @@ struct ImageExample1 {
 
 ![zh-cn_image_0000001250492613](figures/zh-cn_image_0000001250492613.gif)
 
-```
+```ts
 // Image2
 @Entry
 @Component
@@ -221,7 +222,7 @@ struct ImageExample2 {
 
 ![zh-cn_image_0000001205812616](figures/zh-cn_image_0000001205812616.png)
 
-```
+```ts
 // Image3
 @Entry
 @Component

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-imageanimator.md

 # ImageAnimator
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 提供帧动画组件来实现逐帧播放图片的能力，可以配置需要播放的图片列表，每张图片可以配置时长。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -25,7 +25,7 @@ ImageAnimator()
 ## 属性
 
 | 参数名称       | 参数类型                                     | 默认值      | 必填   | 参数描述                                     |
-| -------- | -------- | -------- | -------- | -------- |
+| ---------- | ---------------------------------------- | -------- | ---- | ---------------------------------------- |
 | images     | Array&lt;{<br/>src:string,<br/>width?:Length,<br/>height?:Length,<br/>top?:Length,<br/>left?:Length,<br/>duration?:number<br/>}&gt; | []       | 是    | 设置图片帧信息集合。每一帧的帧信息包含图片路径、图片大小、图片位置和图片播放时长信息。详细说明如下：<br/>src：图片路径，图片格式为svg，png和jpg。<br/>width：图片宽度。<br/>height：图片高度。<br/>top：图片相对于组件左上角的纵向坐标。<br/>left：图片相对于组件左上角的横向坐标。<br/>duration：每一帧图片的播放时长，单位毫秒。 |
 | state      | AnimationStatus                          | Initial  | 否    | 默认为初始状态，用于控制播放状态。                        |
 | duration   | number                                   | 1000     | 否    | 单位为毫秒，默认时长为1000ms；duration为0时，不播放图片；值的改变只会在下一次循环开始时生效；当images中设置了单独的duration后，该属性设置无效。 |
@@ -35,25 +35,26 @@ ImageAnimator()
 | fillMode   | FillMode                                 | Forwards | 否    | 设置动画开始前和结束后的状态，可选值参见FillMode说明。          |
 | iterations | number                                   | 1        | 否    | 默认播放一次，设置为-1时表示无限次播放。                    |
 
-- AnimationStatus枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Initial | 动画初始状态。 |
-  | Running | 动画处于播放状态。 |
-  | Paused | 动画处于暂停状态。 |
-  | Stopped | 动画处于停止状态。 |
+## AnimationStatus枚举说明
+
+| 名称      | 描述        |
+| ------- | --------- |
+| Initial | 动画初始状态。   |
+| Running | 动画处于播放状态。 |
+| Paused  | 动画处于暂停状态。 |
+| Stopped | 动画处于停止状态。 |
 
-- FillMode枚举值说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | None | 播放完成后恢复初始状态。 |
-  | Forwards | 播放完成后保持动画结束时的状态。 |
+## FillMode枚举值说明
 
+| 名称       | 描述               |
+| -------- | ---------------- |
+| None     | 播放完成后恢复初始状态。     |
+| Forwards | 播放完成后保持动画结束时的状态。 |
 
 ## 事件
 
 | 名称                              | 功能描述            |
-| -------- | -------- |
+| ------------------------------- | --------------- |
 | onStart()&nbsp;=&gt;&nbsp;void  | 状态回调，动画开始播放时触发。 |
 | onPause()&nbsp;=&gt;&nbsp;void  | 状态回调，动画暂停播放时触发。 |
 | onRepeat()&nbsp;=&gt;&nbsp;void | 状态回调，动画重新播放时触发。 |
@@ -63,7 +64,8 @@ ImageAnimator()
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ImageAnimatorExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-loadingprogress.md

 # LoadingProgress
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
 用于显示加载进展。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -22,19 +23,17 @@ LoadingProgress()
 
 创建加载进展组件。
 
-
-
 ## 属性
 
 | 名称    | 参数类型  | 默认值  | 描述          |
-| -------- | -------- | -------- | -------- |
+| ----- | ----- | ---- | ----------- |
 | color | Color | -    | 设置加载进度条前景色。 |
 
 
-
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct LoadingProgressExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-marquee.md

 # Marquee
 
-
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+跑马灯组件，用于滚动展示一段单行文本，仅当文本内容宽度超过跑马灯组件宽度时滚动。
 
 
-跑马灯组件，用于滚动展示一段单行文本，仅当文本内容宽度超过跑马灯组件宽度时滚动。
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
 ## 权限列表
@@ -22,20 +22,20 @@
 
 Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boolean, src: string })
 
-- 参数
-    | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | start | boolean | 是 | - | 控制是否进入播放状态。 | 
-  | step | number | 否 | 6 | 滚动动画文本滚动步长。 | 
-  | loop | number | 否 | -1 | 设置重复滚动的次数，小于等于零时无限循环。 | 
-  | fromStart | boolean | 否 | true | 设置文本从头开始滚动或反向滚动。 | 
-  | src | string | 是 | - | 需要滚动的文本。 | 
+**参数：**
 
+| 参数名       | 参数类型    | 必填   | 默认值  | 参数描述                  |
+| --------- | ------- | ---- | ---- | --------------------- |
+| start     | boolean | 是    | -    | 控制是否进入播放状态。           |
+| step      | number  | 否    | 6    | 滚动动画文本滚动步长。           |
+| loop      | number  | 否    | -1   | 设置重复滚动的次数，小于等于零时无限循环。 |
+| fromStart | boolean | 否    | true | 设置文本从头开始滚动或反向滚动。      |
+| src       | string  | 是    | -    | 需要滚动的文本。              |
 
 ## 事件
 
-  | 名称 | 功能描述 | 
-| -------- | -------- |
+| 名称                                       | 功能描述       |
+| ---------------------------------------- | ---------- |
 | onStart(callback: () => void) | 开始滚动时触发回调。 |
 | onBounce(callback: () => void) | 滚动到底时触发回调。 |
 | onFinish(callback: () => void) | 滚动完成时触发回调。 |
@@ -44,7 +44,8 @@ Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boole
 ## 示例
 
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct MarqueeExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-navigation.md

 # Navigation
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 Navigation组件一般作为Page页面的根容器，通过属性设置来展示页面的标题、工具栏、菜单。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -27,7 +27,7 @@ Navigation()
 ## 属性
 
 | 名称             | 参数类型                                     | 默认值                      | 描述                                       |
-| -------- | -------- | -------- | -------- |
+| -------------- | ---------------------------------------- | ------------------------ | ---------------------------------------- |
 | title          | string&nbsp;\|&nbsp;[CustomBuilder](../../ui/ts-types.md)<sup>8+</sup> | -                        | 页面标题。                                    |
 | subtitle       | string                                   | -                        | 页面副标题。                                   |
 | menus          | Array<NavigationMenuItem&gt;&nbsp;\|&nbsp;[CustomBuilder](../../ui/ts-types.md)<sup>8+</sup> | -                        | 页面右上角菜单。                                 |
@@ -37,41 +37,44 @@ Navigation()
 | hideTitleBar   | boolean                                  | false                    | 隐藏标题栏。                                   |
 | hideBackButton | boolean                                  | false                    | 隐藏返回键。                                   |
 
-- NavigationMenuItem类型接口说明
-  | 名称 | 类型 | 必填 | 默认值 | 描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | string | 是 | - | 菜单栏单个选项的显示文本。 | 
-  | icon | string | 否 | - | 菜单栏单个选项的图标资源路径。 | 
-  | action | ()&nbsp;=&gt;&nbsp;void | 否 | - | 当前选项被选中的事件回调。 | 
+## NavigationMenuItem类型说明
 
-- Object类型接口说明
-  | 名称 | 类型 | 必填 | 默认值 | 描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | string | 是 | - | 工具栏单个选项的显示文本。 | 
-  | icon | string | 否 | - | 工具栏单个选项的图标资源路径。 | 
-  | action | ()&nbsp;=&gt;&nbsp;void | 否 | - | 当前选项被选中的事件回调。 | 
+| 名称     | 类型                      | 必填   | 默认值  | 描述              |
+| ------ | ----------------------- | ---- | ---- | --------------- |
+| value  | string                  | 是    | -    | 菜单栏单个选项的显示文本。   |
+| icon   | string                  | 否    | -    | 菜单栏单个选项的图标资源路径。 |
+| action | ()&nbsp;=&gt;&nbsp;void | 否    | -    | 当前选项被选中的事件回调。   |
 
-- NavigationTitleMode枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Free | 当内容为可滚动组件时，标题随着内容向上滚动而缩小（子标题的大小不变、淡出）。向下滚动内容到顶时则恢复原样。 | 
-  | Mini | 固定为小标题模式（图标+主副标题）。 | 
-  | Full | 固定为大标题模式（主副标题）。 | 
+## Object类型接口说明
 
-  > ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-  > 目前可滚动组件只支持List。
+| 名称     | 类型                      | 必填   | 默认值  | 描述              |
+| ------ | ----------------------- | ---- | ---- | --------------- |
+| value  | string                  | 是    | -    | 工具栏单个选项的显示文本。   |
+| icon   | string                  | 否    | -    | 工具栏单个选项的图标资源路径。 |
+| action | ()&nbsp;=&gt;&nbsp;void | 否    | -    | 当前选项被选中的事件回调。   |
 
+## NavigationTitleMode枚举说明
+
+| 名称   | 描述                                       |
+| ---- | ---------------------------------------- |
+| Free | 当内容为可滚动组件时，标题随着内容向上滚动而缩小（子标题的大小不变、淡出）。向下滚动内容到顶时则恢复原样。 |
+| Mini | 固定为小标题模式（图标+主副标题）。                       |
+| Full | 固定为大标题模式（主副标题）。                          |
+
+>  **说明：**
+>
+>  目前可滚动组件只支持List。
 
 ## 事件
 
 | 名称                                       | 功能描述                                     |
-| -------- | -------- |
+| ---------------------------------------- | ---------------------------------------- |
 | onTitleModeChange(callback:&nbsp;(titleMode:&nbsp;NavigationTitleMode)&nbsp;=&gt;&nbsp;void) | 当titleMode为NavigationTitleMode.Free时，随着可滚动组件的滑动标题栏模式发生变化时触发此回调。 |
 
 
 ## 示例
 
-```
+```ts
 // Example 01
 @Entry
 @Component
@@ -159,7 +162,7 @@ struct NavigationExample {
 
 ![zh-cn_image_0000001237616085](figures/zh-cn_image_0000001237616085.gif)
 
-```
+```ts
 // Example 02
 @Entry
 @Component

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md

 # Progress
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 进度条，用于显示内容加载或操作处理进度。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -17,34 +17,34 @@
 无
 
 
-## 接口说明
+## 接口
 
 Progress(value: {value: number, total?: number, type?: ProgressType})
 
 创建进度组件，用于显示内容加载或操作处理进度。
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | number | 是 | - | 指定当前进度值。 |
-  | total | number | 否 | 100 | 指定进度总长。 |
-  | type | ProgressType | 否 | ProgressType.Linear | 指定进度条样式。 |
+**参数：** 
 
+| 参数名   | 参数类型         | 必填   | 默认值                 | 参数描述     |
+| ----- | ------------ | ---- | ------------------- | -------- |
+| value | number       | 是    | -                   | 指定当前进度值。 |
+| total | number       | 否    | 100                 | 指定进度总长。  |
+| type  | ProgressType | 否    | ProgressType.Linear | 指定进度条样式。 |
 
-- ProgressType枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Linear | 线性样式。 |
-  | Ring<sup>8+</sup> | 环形无刻度样式，环形圆环逐渐填充完成过程。 |
-  | Eclipse | 圆形样式，展现类似月圆月缺的进度展示效果，从月牙逐渐到满月的这个过程代表了下载的进度。 |
-  | ScaleRing<sup>8+</sup> | 环形有刻度样式，类似时钟刻度形式加载进度。 |
-  | Capsule<sup>8+</sup> | 胶囊样式，头尾两端处，进度条由弧形变成直线和直线变成弧形的过程；中段处，进度条正常往右走的过程。 |
+## ProgressType枚举说明
 
+| 名称                     | 描述                                       |
+| ---------------------- | ---------------------------------------- |
+| Linear                 | 线性样式。                                    |
+| Ring<sup>8+</sup>      | 环形无刻度样式，环形圆环逐渐填充完成过程。                    |
+| Eclipse                | 圆形样式，展现类似月圆月缺的进度展示效果，从月牙逐渐到满月的这个过程代表了下载的进度。 |
+| ScaleRing<sup>8+</sup> | 环形有刻度样式，类似时钟刻度形式加载进度。                    |
+| Capsule<sup>8+</sup>   | 胶囊样式，头尾两端处，进度条由弧形变成直线和直线变成弧形的过程；中段处，进度条正常往右走的过程。 |
 
 ## 属性
 
 | 名称                 | 参数类型                                     | 默认值  | 描述                                       |
-| -------- | -------- | -------- | -------- |
+| ------------------ | ---------------------------------------- | ---- | ---------------------------------------- |
 | value              | number                                   | -    | 设置当前进度值。                                 |
 | color              | Color                                    | -    | 设置进度条前景色。                                |
 | style<sup>8+</sup> | {<br/>strokeWidth？:&nbsp;Length,<br/>scaleCount？:&nbsp;number,<br/>scaleWidth？:&nbsp;Length<br/>} | -    | 定义组件的样式。<br/>strokeWidth:&nbsp;设置进度条宽度。<br/>scaleCount:&nbsp;设置环形进度条总刻度数。<br/>scaleWidth:&nbsp;设置环形进度条刻度粗细。<br/>刻度粗细大于进度条宽度时，刻度粗细为系统默认粗细。 |
@@ -52,7 +52,8 @@ Progress(value: {value: number, total?: number, type?: ProgressType})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ProgressExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-qrcode.md

 # QRCode
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 显示二维码信息。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,27 +21,28 @@
 
 QRCode(value: string)
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | string | 是 | - | 二维码内容字符串。 | 
+**参数：**
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述      |
+| ----- | ------ | ---- | ---- | --------- |
+| value | string | 是    | -    | 二维码内容字符串。 |
 
 ## 属性
 
 | 名称    | 参数类型  | 默认值   | 描述       |
-| -------- | -------- | -------- | -------- |
+| ----- | ----- | ----- | -------- |
 | color | Color | Black | 设置二维码颜色。 |
 
 
 ## 事件
 
-通用事件仅支持点击事件。
+通用事件仅支持[点击事件](ts-universal-events-click.md)。
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct QRCodeExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-radio.md

 # Radio
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 单选框，提供相应的用户交互选择项。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,30 +21,31 @@
 
 Radio(options: {value: string, group: string})
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | string | 是 | - | 当前单选框的值。|
-  | group | string | 是 | - | 当前单选框的所属群组名称，相同group的Radio只能有一个被选中。|
+**参数：**
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述                                |
+| ----- | ------ | ---- | ---- | ----------------------------------- |
+| value | string | 是    | -    | 当前单选框的值。                            |
+| group | string | 是    | -    | 当前单选框的所属群组名称，相同group的Radio只能有一个被选中。 |
 
 ## 属性
 
 | 名称      | 参数类型    | 默认值   | 描述          |
-| -------- | -------- | -------- | -------- |
+| ------- | ------- | ----- | ----------- |
 | checked | boolean | false | 设置单选框的选中状态。 |
 
 
 ## 事件
 
 | 名称                                       | 功能描述                                     |
-| -------- | -------- |
+| ---------------------------------------- | ---------------------------------------- |
 | onChange(callback: (value: boolean) => void) | 单选框选中状态改变时触发回调。<br> -value为true时，代表选中。<br> -value为false时，代表未选中。 |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RadioExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-rating.md

 # Rating
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 评分条组件。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -17,21 +17,21 @@
 无
 
 
-## 接口说明
+## 接口
 
 Rating(options?: { rating: number, indicator?: boolean })
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | rating | number | 是 | 0 | 设置并接收评分值。 | 
-  | indicator | boolean | 否 | false | 仅作为指示器使用，不可操作。 | 
+**参数：**
 
+| 参数名       | 参数类型    | 必填   | 默认值   | 参数描述           |
+| --------- | ------- | ---- | ----- | -------------- |
+| rating    | number  | 是    | 0     | 设置并接收评分值。      |
+| indicator | boolean | 否    | false | 仅作为指示器使用，不可操作。 |
 
 ## 属性
 
 | 名称        | 参数类型                                     | 默认值  | 描述                                       |
-| -------- | -------- | -------- | -------- |
+| --------- | ---------------------------------------- | ---- | ---------------------------------------- |
 | stars     | number                                   | 5    | 设置评星总数。                                  |
 | stepSize  | number                                   | 0.5  | 操作评级的步长。                                 |
 | starStyle | {<br/>backgroundUri:&nbsp;string,<br/>foregroundUri:&nbsp;string,<br/>secondaryUri?:&nbsp;string<br/>} | -    | backgroundSrc：未选中的星级的图片链接，可由用户自定义或使用系统默认图片，仅支持本地。<br/>foregroundSrc：选中的星级的图片路径，可由用户自定义或使用系统默认图片，仅支持本地。<br/>secondarySrc：部分选中的星级的图片路径，可由用户自定义或使用系统默认图片，仅支持本地。 |
@@ -40,13 +40,14 @@ Rating(options?: { rating: number, indicator?: boolean })
 ## 事件
 
 | 名称                                       | 功能描述                |
-| -------- | -------- |
+| ---------------------------------------- | ------------------- |
 | onChange(callback:(value:&nbsp;number)&nbsp;=&gt;&nbsp;void) | 操作评分条的评星发生改变时触发该回调。 |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RatingExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-richtext.md

 # RichText
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
 富文本组件，解析并显示HTML格式文本。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 ## 权限列表
 
 无
@@ -15,27 +16,25 @@
 
 ## 接口
 
-RichText\(content:string\)
+RichText\(content: string\)
 
-- 参数
-
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | content | string | 是 | - | 表示HTML格式的字符串。 |
+**参数：**
 
+| 参数名     | 参数类型   | 必填   | 默认值  | 参数描述          |
+| ------- | ------ | ---- | ---- | ------------- |
+| content | string | 是    | -    | 表示HTML格式的字符串。 |
 
 ## 事件
 
-
 | 名称                   | 描述         |
-| -------- | -------- |
+| -------------------- | ---------- |
 | onStart() => void    | 加载网页时触发。   |
 | onComplete() => void | 网页加载结束时触发。 |
 
 ## 支持标签
 
 | 名称                  | 描述                                       | 示例                                       |
-| -------- | -------- | -------- |
+| ------------------- | ---------------------------------------- | ---------------------------------------- |
 | \<h1>--\<h6>        | 被用来定义HTML，\<h1>定义重要等级最高的标题，\<h6>定义重要等级最低的标题。 | \<h1>这是一个标题\</h1>\<h2>这是h2标题\</h2>       |
 | \<p>\</p>           | 定义段落。                                    | \<p>这是一个段落\</p>                          |
 | \<br/>              | 插入一个简单的换行符。                              | \<p>这是一个段落\<br/>这是换行段落\</p>              |
@@ -49,7 +48,8 @@ RichText\(content:string\)
 
 ## 示例
 示例效果请以真机运行为准，当前IDE预览器不支持。
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RichTextExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-scrollbar.md

 # ScrollBar
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 滚动条组件ScrollBar，用于配合可滚动组件使用，如List、Grid、Scroll。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,35 +21,38 @@
 
 ScrollBar(value: ScrollBarOptions)
 
-- ScrollBarOptions的参数描述
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | scroller | [Scroller](ts-container-scroll.md#scroller) | 是 | - | 可滚动组件的控制器。用于与可滚动组件进行绑定。 |
-  | direction | ScrollBarDirection | 否 | ScrollBarDirection.Vertical | 滚动条的方向，控制可滚动组件对应方向的滚动。 |
-  | state | BarState | 否 | BarState.Auto | 滚动条状态。 |
+**参数：**
+
+| 参数名       | 参数类型                                     | 必填   | 默认值                         | 参数描述                    |
+| --------- | ---------------------------------------- | ---- | --------------------------- | ----------------------- |
+| scroller  | [Scroller](ts-container-scroll.md#scroller) | 是    | -                           | 可滚动组件的控制器。用于与可滚动组件进行绑定。 |
+| direction | ScrollBarDirection                       | 否    | ScrollBarDirection.Vertical | 滚动条的方向，控制可滚动组件对应方向的滚动。  |
+| state     | BarState                                 | 否    | BarState.Auto               | 滚动条状态。                  |
 
-  > ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-  > ScrollBar组件负责定义可滚动区域的行为样式，ScrollBar的子节点负责定义滚动条的行为样式。
-  > 
-  > 滚动条组件与可滚动组件通过Scroller进行绑定，且只有当两者方向相同时，才能联动，ScrollBar与可滚动组件仅支持一对一绑定。
+>  **说明：**
+>  ScrollBar组件负责定义可滚动区域的行为样式，ScrollBar的子节点负责定义滚动条的行为样式。
+>
+>  滚动条组件与可滚动组件通过Scroller进行绑定，且只有当两者方向相同时，才能联动，ScrollBar与可滚动组件仅支持一对一绑定。
 
-- ScrollBarDirection枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Vertical | 纵向滚动条。 | 
-  | Horizontal | 横向滚动条。 | 
+## ScrollBarDirection枚举说明
 
-- BarState枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | On | 常驻显示。 | 
-  | Off | 不显示。 | 
-  | Auto | 按需显示(触摸时显示，无操作2s后消失)。 | 
+| 名称         | 描述     |
+| ---------- | ------ |
+| Vertical   | 纵向滚动条。 |
+| Horizontal | 横向滚动条。 |
 
+## BarState枚举说明
+
+| 名称   | 描述                    |
+| ---- | --------------------- |
+| On   | 常驻显示。                 |
+| Off  | 不显示。                  |
+| Auto | 按需显示(触摸时显示，无操作2s后消失)。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ScrollBarExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md

 #  Search
 
-> ![](public_sys-resources/icon-note.gif) **说明：** 
+提供搜索框组件，用于提供用户搜索内容的输入区域。
+
+> **说明：** 
 >
 > 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
-提供搜索框组件，用于提供用户搜索内容的输入区域。
-
 ## 权限列表
 
 无
@@ -18,15 +18,14 @@
 
 Search(options?: { value?: string; placeholder?: string; icon?: string; controller?: SearchController })
 
-- 参数
-
-  | 参数名         | 参数类型             | 必填   | 默认值  | 参数描述                                     |
-  | ----------- | ---------------- | ---- | ---- | ---------------------------------------- |
-  | value       | string           | 否    | -    | 搜索文本值。                                   |
-  | placeholder | string           | 否    | -    | 无输入时的提示文本。                               |
-  | icon        | string           | 否    | -    | 搜索图标路径，默认使用系统搜索图标，支持的图标格式: svg, jpg和png。 |
-  | controller  | SearchController | 否    | -    | 控制器。                                     |
+**参数：**
 
+| 参数名         | 参数类型             | 必填   | 默认值  | 参数描述                                     |
+| ----------- | ---------------- | ---- | ---- | ---------------------------------------- |
+| value       | string           | 否    | -    | 搜索文本值。                                   |
+| placeholder | string           | 否    | -    | 无输入时的提示文本。                               |
+| icon        | string           | 否    | -    | 搜索图标路径，默认使用系统搜索图标，支持的图标格式: svg, jpg和png。 |
+| controller  | SearchController | 否    | -    | 控制器。                                     |
 
 ## 属性
 
@@ -61,17 +60,17 @@ caretPosition(value: number): viod
 
 设置输入光标的位置。
 
-- 参数
-
-  | 参数名   | 参数类型   | 必填   | 默认值  | 参数描述              |
-  | ----- | ------ | ---- | ---- | ----------------- |
-  | value | number | 是    | -    | 从字符串开始到光标所在位置的长度。 |
+**参数：**
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述              |
+| ----- | ------ | ---- | ---- | ----------------- |
+| value | number | 是    | -    | 从字符串开始到光标所在位置的长度。 |
 
 
 ##  示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct SearchExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-select.md

 #  Select
 
-> ![](public_sys-resources/icon-note.gif) **说明：** 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
 提供下拉选择菜单，可以让用户在多个选项之间选择。
 
+>  **说明：** 
+>
+> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 ## 权限列表
 
 无
@@ -16,17 +18,17 @@
 
 Select(options: Array\<SelectOption\>)
 
-- SelectOption参数
+**参数：**
 
-  | 参数名 | 参数类型                                        | 必填 | 默认值 | 参数描述       |
-  | ------ | ----------------------------------------------- | ---- | ------ | -------------- |
-  | value  | [ResourceStr](../../ui/ts-types.md) | 是   | -      | 下拉选项内容。 |
-  | icon   | [ResourceStr](../../ui/ts-types.md) | 否   | -      | 下拉选项图片。 |
+| 参数名   | 参数类型                                | 必填   | 默认值  | 参数描述    |
+| ----- | ----------------------------------- | ---- | ---- | ------- |
+| value | [ResourceStr](../../ui/ts-types.md) | 是    | -    | 下拉选项内容。 |
+| icon  | [ResourceStr](../../ui/ts-types.md) | 否    | -    | 下拉选项图片。 |
 
 ## 属性
 
 | 名称                      | 参数类型                                  | 默认值  | 描述                       |
-| ----------------------- | --------------------------------------------------- | ------ | ----------------------------------------------- |
+| ----------------------- | ------------------------------------- | ---- | ------------------------ |
 | selected                | number                                | -    | 设置下拉菜单初始选择项的索引，第一项的索引为0。 |
 | value                   | string                                | -    | 设置下拉按钮本身的文本显示。           |
 | font                    | [Font](../../ui/ts-types.md)          | -    | 设置下拉按钮本身的文本样式：           |
@@ -41,12 +43,13 @@ Select(options: Array\<SelectOption\>)
 ## 事件
 
 | 名称                                       | 功能描述                                   |
-| ----------------------------------------------------------- | ------------------------------------------------------------ |
+| ---------------------------------------- | -------------------------------------- |
 | onSelect(callback: (index: number, value?:string) => void） | 下拉菜单选中某一项的回调。index：选中项的索引。value：选中项的值。 |
 
 ##  示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct SelectExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-slider.md

 # Slider
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 滑动条组件，用来快速调节设置值，如音量、亮度等。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,30 +21,31 @@
 
 Slider(value:{value?: number, min?: number, max?: number, step?: number, style?: SliderStyle, direction?: Axis})
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | number | 否 | 0 | 当前进度值。 |
-  | min | number | 否 | 0 | 设置最小值。 |
-  | max | number | 否 | 100 | 设置最大值。 |
-  | step | number | 否 | 1 | 设置Slider滑动跳动值，当设置相应的step时，Slider为间歇滑动。 |
-  | style | SliderStyle | 否 | SliderStyle.OutSet | 设置Slider的滑块样式。 |
-  | direction<sup>8+</sup> | [Axis](ts-appendix-enums.md#axis枚举说明) | 否 | Axis.Horizontal | 设置滑动条滑动方向为水平或竖直方向。 |
-  | reverse<sup>8+</sup> | boolean | 否 | false | 设置滑动条取值范围是否反向。 |
+**参数：**
+
+| 参数名                    | 参数类型                                  | 必填   | 默认值                | 参数描述                                   |
+| ---------------------- | ------------------------------------- | ---- | ------------------ | -------------------------------------- |
+| value                  | number                                | 否    | 0                  | 当前进度值。                                 |
+| min                    | number                                | 否    | 0                  | 设置最小值。                                 |
+| max                    | number                                | 否    | 100                | 设置最大值。                                 |
+| step                   | number                                | 否    | 1                  | 设置Slider滑动跳动值，当设置相应的step时，Slider为间歇滑动。 |
+| style                  | SliderStyle                           | 否    | SliderStyle.OutSet | 设置Slider的滑块样式。                         |
+| direction<sup>8+</sup> | [Axis](ts-appendix-enums.md#axis枚举说明) | 否    | Axis.Horizontal    | 设置滑动条滑动方向为水平或竖直方向。                     |
+| reverse<sup>8+</sup>   | boolean                               | 否    | false              | 设置滑动条取值范围是否反向。                         |
 
-- SliderStyle枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | OutSet | 滑块在滑轨上。 |
-  | InSet | 滑块在滑轨内。 |
+## SliderStyle枚举说明
 
+| 名称     | 描述      |
+| ------ | ------- |
+| OutSet | 滑块在滑轨上。 |
+| InSet  | 滑块在滑轨内。 |
 
 ## 属性
 
 不支持触摸热区设置。
 
 | 名称            | 参数类型    | 默认值   | 描述                |
-| -------- | -------- | -------- | -------- |
+| ------------- | ------- | ----- | ----------------- |
 | blockColor    | Color   | -     | 设置滑块的颜色。          |
 | trackColor    | Color   | -     | 设置滑轨的背景颜色。        |
 | selectedColor | Color   | -     | 设置滑轨的已滑动颜色。       |
@@ -57,20 +58,21 @@ Slider(value:{value?: number, min?: number, max?: number, step?: number, style?:
 通用事件仅支持：OnAppear，OnDisAppear。
 
 | 名称                                       | 功能描述                                     |
-| -------- | -------- |
+| ---------------------------------------- | ---------------------------------------- |
 | onChange(callback:&nbsp;(value:&nbsp;number,&nbsp;mode:&nbsp;SliderChangeMode)&nbsp;=&gt;&nbsp;void） | Slider滑动时触发事件回调。<br/>value：当前进度值。<br/>mode：拖动状态。 |
 
-- SliderChangeMode枚举说明
-  | 名称 | 值 | 描述 |
-  | -------- | -------- | -------- |
-  | Begin | 0 | 用户开始拖动滑块。 |
-  | Moving | 1 | 用户拖动滑块中。 |
-  | End | 2 | 用户结束拖动滑块。 |
+## SliderChangeMode枚举说明
 
+| 名称     | 值    | 描述        |
+| ------ | ---- | --------- |
+| Begin  | 0    | 用户开始拖动滑块。 |
+| Moving | 1    | 用户拖动滑块中。  |
+| End    | 2    | 用户结束拖动滑块。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct SliderExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-span.md

 # Span
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 文本段落，只能作为Text子组件，呈现一段文本信息。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,18 +21,18 @@
 
 Span(content: string)
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | content | string | 是 | - | 文本内容。 | 
+**参数:**
 
+| 参数名     | 参数类型   | 必填   | 默认值  | 参数描述  |
+| ------- | ------ | ---- | ---- | ----- |
+| content | string | 是    | -    | 文本内容。 |
 
 ## 属性
 
 通用属性方法仅支持通用文本样式，不支持触摸热区设置。
 
 | 名称         | 参数类型                                     | 默认值                                      | 描述             |
-| -------- | -------- | -------- | -------- |
+| ---------- | ---------------------------------------- | ---------------------------------------- | -------------- |
 | decoration | {<br/>type:&nbsp;[TextDecorationType](ts-appendix-enums.md#textdecorationtype枚举说明),<br/>color?:&nbsp;Color<br/>} | {<br/>type:&nbsp;TextDecorationType.None<br/>color：Color.Black<br/>} | 设置文本装饰线样式及其颜色。 |
 | textCase   | [TextCase](ts-appendix-enums.md#textcase枚举说明) | Normal                                   | 设置文本大小写。       |
 
@@ -41,13 +41,14 @@ Span(content: string)
 
 通用事件仅支持点击事件。
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 >  由于Span组件无尺寸信息，因此点击事件返回的ClickEvent对象的target属性无效。
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct SpanExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-stepper.md

 # Stepper
 
-
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+步骤导航器。
 
 
-步骤导航器。
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
 ## 权限列表
@@ -22,12 +22,11 @@
 
 Stepper(value?: { index?: number })
 
+**参数：**
 
-- 参数
-    | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | index | number | 否 | 0 | 设置步骤导航器显示第几个StepperItem。 | 
-
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述                     |
+| ----- | ------ | ---- | ---- | ------------------------ |
+| index | number | 否    | 0    | 设置步骤导航器显示第几个StepperItem。 |
 
 ## 属性
 
@@ -36,8 +35,8 @@ Stepper(value?: { index?: number })
 
 ## 事件
 
-  | 名称 | 描述 | 
-| -------- | -------- |
+| 名称                                       | 描述                                       |
+| ---------------------------------------- | ---------------------------------------- |
 | onFinish(callback: () => void) | 步骤导航器最后一个StepperItem的nextLabel被点击时触发该回调 。 |
 | onSkip(callback: () => void) | 当前显示的StepperItem状态为ItemState.Skip时，nextLabel被点击时触发该回调。 |
 | onChange(callback:&nbsp;(prevIndex?:&nbsp;number,&nbsp;index?:&nbsp;number)&nbsp;=&gt;&nbsp;void) | 点击左边或者右边文本按钮进行步骤切换时触发该事件。<br/>-&nbsp;prevIndex：切换前的步骤页索引值。<br/>-&nbsp;index：切换后的步骤页（前一页或者下一页）索引值。 |
@@ -45,7 +44,8 @@ Stepper(value?: { index?: number })
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct StepperExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-stepperitem.md

 # StepperItem
 
-
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+步骤导航器元素。
 
 
-步骤导航器元素。
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
 ## 权限列表
@@ -26,19 +26,19 @@ StepperItem()
 ## 属性
 
 | 参数名       | 参数类型      | 默认值              | 参数描述                                  |
-| -------- | -------- | -------- | -------- |
+| --------- | --------- | ---------------- | ------------------------------------- |
 | prevLabel | string    | -                | 当步骤导航器大于一页，除第一页默认值都为"返回"。             |
 | nextLabel | string    | -                | 步骤导航器大于一页时，最后一页默认值为"开始"，其余页默认值为"下一步"。 |
 | status    | ItemState | ItemState.Normal | 步骤导航器元素的状态。                           |
 
-- ItemState枚举说明
-    | 名称 | 描述 | 
-  | -------- | -------- |
-  | Normal | 正常状态，右侧文本按钮正常显示，可点击进入下一个StepperItem。 | 
-  | Disabled | 不可用状态，右侧文本按钮灰度显示，不可点击进入下一个StepperItem。 | 
-  | Waiting | 等待状态，右侧文本按钮不显示，使用等待进度条，不可点击进入下一个StepperItem。 | 
-  | Skip | 跳过状态，表示跳过当前步骤, 进入下一个StepperItem。 | 
+## ItemState枚举说明
 
+| 名称       | 描述                                       |
+| -------- | ---------------------------------------- |
+| Normal   | 正常状态，右侧文本按钮正常显示，可点击进入下一个StepperItem。     |
+| Disabled | 不可用状态，右侧文本按钮灰度显示，不可点击进入下一个StepperItem。   |
+| Waiting  | 等待状态，右侧文本按钮不显示，使用等待进度条，不可点击进入下一个StepperItem。 |
+| Skip     | 跳过状态，表示跳过当前步骤, 进入下一个StepperItem。    |
 
 ## 示例
 

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-text.md

 # Text
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 文本，用于呈现一段信息。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,16 +21,16 @@
 
 Text(content?: string)
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | content | string | 否 | '' | 文本内容。包含子组件Span时不生效，显示Span内容，并且此时text组件的样式不生效。 |
+**参数：**
 
+| 参数名     | 参数类型   | 必填   | 默认值  | 参数描述                                     |
+| ------- | ------ | ---- | ---- | ---------------------------------------- |
+| content | string | 否    | ''   | 文本内容。包含子组件Span时不生效，显示Span内容，并且此时text组件的样式不生效。 |
 
 ## 属性
 
 | 名称             | 参数类型                                     | 默认值                                      | 描述                                       |
-| -------- | -------- | -------- | -------- |
+| -------------- | ---------------------------------------- | ---------------------------------------- | ---------------------------------------- |
 | textAlign      | TextAlign                                | TextAlign.Start                          | 设置多行文本的文本对齐方式。                           |
 | textOverflow   | {overflow:&nbsp;TextOverflow}            | {overflow:&nbsp;TextOverflow.Clip}       | 设置文本超长时的显示方式。<br/>**说明：**<br/>文本截断是按字截断。例如，英文以单词为最小单位进行截断，若需要以字母为单位进行截断，可在字母间添加零宽空格：\u200B。 |
 | maxLines       | number                                   | Infinity                                 | 设置文本的最大行数。                               |
@@ -39,42 +39,48 @@ Text(content?: string)
 | baselineOffset | Length                                   | -                                        | 设置文本基线的偏移量。                              |
 | textCase       | TextCase                                 | TextCase.Normal                          | 设置文本大小写。                                 |
 
-- TextAlign枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Center | 文本居中对齐。 |
-  | Start | 根据文字书写相同的方向对齐。 |
-  | End | 根据文字书写相反的方向对齐。 |
-
-- TextOverflow枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Clip | 文本超长时进行裁剪显示。 |
-  | Ellipsis | 文本超长时显示不下的文本用省略号代替。 |
-  | None | 文本超长时不进行裁剪。 |
-
-- TextDecorationType枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Underline | 文字下划线修饰。 |
-  | LineThrough | 穿过文本的修饰线。 |
-  | Overline | 文字上划线修饰。 |
-  | None | 不使用文本装饰线。 |
-
-- TextCase枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Normal | 保持文本原有大小写。 |
-  | LowerCase | 文本采用全小写。 |
-  | UpperCase | 文本采用全大写。 |
-
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+## TextAlign枚举说明
+
+| 名称     | 描述             |
+| ------ | -------------- |
+| Center | 文本居中对齐。        |
+| Start  | 根据文字书写相同的方向对齐。 |
+| End    | 根据文字书写相反的方向对齐。 |
+
+## TextOverflow枚举说明
+
+| 名称       | 描述                  |
+| -------- | ------------------- |
+| Clip     | 文本超长时进行裁剪显示。        |
+| Ellipsis | 文本超长时显示不下的文本用省略号代替。 |
+| None     | 文本超长时不进行裁剪。         |
+
+## TextDecorationType枚举说明
+
+| 名称          | 描述        |
+| ----------- | --------- |
+| Underline   | 文字下划线修饰。  |
+| LineThrough | 穿过文本的修饰线。 |
+| Overline    | 文字上划线修饰。  |
+| None        | 不使用文本装饰线。 |
+
+## TextCase枚举说明
+
+| 名称        | 描述         |
+| --------- | ---------- |
+| Normal    | 保持文本原有大小写。 |
+| LowerCase | 文本采用全小写。   |
+| UpperCase | 文本采用全大写。   |
+
+>  **说明：**
+>
 >  不支持Text内同时存在文本内容和Span子组件。（如果同时存在，只显示Span内的内容)。
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextExample1 {
@@ -112,7 +118,8 @@ struct TextExample1 {
 
 ![zh-cn_image_0000001219864155](figures/zh-cn_image_0000001219864155.gif)
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextExample2 {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md

 # TextArea
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 提供多行文本输入组件。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,12 +21,12 @@
 
 TextArea(value?:{placeholder?: string, controller?: TextAreaController})
 
-- 参数
-  | 参数名                     | 参数类型                                     | 必填   | 默认值  | 参数描述           |
-  | ----------------------- | ---------------------------------------- | ---- | ---- | -------------- |
-  | placeholder             | string                                   | 否    | -    | 无输入时的提示文本。     |
-  | controller<sup>8+</sup> | [TextAreaController](#textareacontroller8) | 否    | -    | 设置TextArea控制器。 |
+**参数：**
 
+| 参数名                     | 参数类型                                     | 必填   | 默认值  | 参数描述           |
+| ----------------------- | ---------------------------------------- | ---- | ---- | -------------- |
+| placeholder             | string                                   | 否    | -    | 无输入时的提示文本。     |
+| controller<sup>8+</sup> | [TextAreaController](#textareacontroller8) | 否    | -    | 设置TextArea控制器。 |
 
 ## 属性
 
@@ -40,13 +40,13 @@ TextArea(value?:{placeholder?: string, controller?: TextAreaController})
 | caretColor               | Color                                    | -     | 设置输入框光标颜色。                               |
 | inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](../../ui/ts-types.md)<sup>8+</sup>,<br/>error?:&nbsp;(value:&nbsp;string)<br/>} | -     | 通过正则表达式设置输入过滤器。满足表达式的输入允许显示，不满足的输入被忽略。仅支持单个字符匹配，不支持字符串匹配。例如：^(?=.\*\d)(?=.\*[a-z])(?=.\*[A-Z]).{8,10}$，不支持过滤8到10位的强密码。<br/>-&nbsp;value：设置正则表达式。<br/>-&nbsp;error：正则匹配失败时，返回被忽略的内容。 |
 
-- TextAlign枚举说明
-  | 名称     | 描述      |
-  | ------ | ------- |
-  | Start  | 水平对齐首部。 |
-  | Center | 水平居中对齐。 |
-  | End    | 水平对齐尾部。 |
+## TextAlign枚举说明
 
+| 名称     | 描述      |
+| ------ | ------- |
+| Start  | 水平对齐首部。 |
+| Center | 水平居中对齐。 |
+| End    | 水平对齐尾部。 |
 
 ## 事件
 
@@ -74,18 +74,19 @@ caretPosition(value: number): void
 
 设置输入光标的位置。
 
-- 参数
-  | 参数名   | 参数类型   | 必填   | 默认值  | 参数描述                |
-  | ----- | ------ | ---- | ---- | ------------------- |
-  | value | number | 是    | -    | 从字符串开始到光标所在位置的字符长度。 |
+**参数：**
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述                |
+| ----- | ------ | ---- | ---- | ------------------- |
+| value | number | 是    | -    | 从字符串开始到光标所在位置的字符长度。 |
 
 ## 示例
 
 
 ### 多行文本输入
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextAreaExample1 {
@@ -122,7 +123,8 @@ struct TextAreaExample1 {
 
 ### 设置光标
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextAreaExample2 {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textclock.md

 # TextClock
 
-> ![](public_sys-resources/icon-note.gif) **说明：** 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
 TextClock通过文本显示当前系统时间，支持不同时区的时间显示，时间显示最高精度到秒级。
 
+> **说明：** 
+>
+> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 ## 权限列表
 
 无
@@ -16,23 +18,23 @@ TextClock通过文本显示当前系统时间，支持不同时区的时间显
 
 TextClock(options?: {timeZoneOffset?: number, contorller?: TextClockController})
 
-- 参数
+**参数:**
 
-  | 参数名   | 参数类型 | 必填 | 默认值             | 参数描述                                                     |
-  | -------- | -------- | ---- | ------------------ | ------------------------------------------------------------ |
-  | timeZoneOffset | number   | 否   | 时区偏移量 | 设置时区偏移量。取值范围为[-14, 12]，表示东十二区到西十二区，其中负值表示东时区，正值表示西时区，比如东八区为-8；对横跨国际日界线的国家或地区，用-13（UTC+13）和-14（UTC+14）来保证整个国家或者区域处在相同的时间。 |
-  | contorller | [TextClockContorller](#TextClockController) | 否 | null | 绑定一个控制器，用来控制文本时钟的状态。|
+| 参数名            | 参数类型                                     | 必填   | 默认值   | 参数描述                                     |
+| -------------- | ---------------------------------------- | ---- | ----- | ---------------------------------------- |
+| timeZoneOffset | number                                   | 否    | 时区偏移量 | 设置时区偏移量。取值范围为[-14, 12]，表示东十二区到西十二区，其中负值表示东时区，正值表示西时区，比如东八区为-8；对横跨国际日界线的国家或地区，用-13（UTC+13）和-14（UTC+14）来保证整个国家或者区域处在相同的时间。 |
+| contorller     | [TextClockContorller](#TextClockController) | 否    | null  | 绑定一个控制器，用来控制文本时钟的状态。                     |
 
 ## 属性
 
 | 名称     | 参数类型   | 默认值      | 描述                                       |
-| ------ | -------- | -------- | ------------------------------------------------------------ |
+| ------ | ------ | -------- | ---------------------------------------- |
 | format | string | 'hhmmss' | 设置显示时间格式，如“yyyy/mm/dd”、“yyyy-mm-dd”等。支持的时间格式化字符串：<ul><li>yyyy（年份）</li><li>mm（英文月份简写）</li><li>mmm（英文月份简写）</li><li>mmmm（英文月份全称）</li><li>dd（英文星期简写）</li><li>ddd（英文星期简写）</li><li>dddd（英文星期全称）</li><li>HH（24小时制）</li><li>hh（12小时制）</li><li>MM/mm（分钟）</li><li>SS/ss（秒）</li></ul> |
 
 ## 事件
 
 | 名称                                       | 功能描述                                     |
-| -------------------------------------------- | ------------------------------------------------------------ |
+| ---------------------------------------- | ---------------------------------------- |
 | onDateChange(event: (value: number) => void) | 提供时间变化回调,该事件最小回调间隔为秒。<br /> value: Unix Time Stamp，即自1970年1月1日（UTC）起经过的毫秒数。 |
 
 ## TextClockController
@@ -61,7 +63,8 @@ stop()
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct Second {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textinput.md

 # TextInput
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 提供单行文本输入组件。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,12 +21,12 @@
 
 TextInput(value?:{placeholder?: string controller?: TextInputController})
 
-- 参数
-  | 参数名                     | 参数类型                                     | 必填   | 默认值  | 参数描述            |
-  | ----------------------- | ---------------------------------------- | ---- | ---- | --------------- |
-  | placeholder             | string                                   | 否    | -    | 无输入时的提示文本。      |
-  | controller<sup>8+</sup> | [TextInputController](#textinputcontroller8) | 否    | -    | 设置TextInput控制器。 |
+**参数：**
 
+| 参数名                     | 参数类型                                     | 必填   | 默认值  | 参数描述            |
+| ----------------------- | ---------------------------------------- | ---- | ---- | --------------- |
+| placeholder             | string                                   | 否    | -    | 无输入时的提示文本。      |
+| controller<sup>8+</sup> | [TextInputController](#textinputcontroller8) | 否    | -    | 设置TextInput控制器。 |
 
 ## 属性
 
@@ -42,23 +42,24 @@ TextInput(value?:{placeholder?: string controller?: TextInputController})
 | maxLength                | number                                   | -                 | 设置文本的最大输入字符数。                            |
 | inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](../../ui/ts-types.md)<sup>8+</sup>,<br/>error?:&nbsp;(value:&nbsp;string)<br/>} | -                 | 正则表达式，满足表达式的输入允许显示，不满足正则表达式的输入被忽略。仅支持单个字符匹配，不支持字符串匹配。例如：^(?=.\*\d)(?=.\*[a-z])(?=.\*[A-Z]).{8,10}$，8到10位的强密码不支持过滤。<br/>-&nbsp;value：设置正则表达式。<br/>-&nbsp;error：正则匹配失败时，返回被忽略的内容。 |
 
-- EnterKeyType枚举说明
-  | 名称                  | 描述        |
-  | ------------------- | --------- |
-  | EnterKeyType.Go     | 显示Go文本。   |
-  | EnterKeyType.Search | 显示为搜索样式。  |
-  | EnterKeyType.Send   | 显示为发送样式。  |
-  | EnterKeyType.Next   | 显示为下一个样式。 |
-  | EnterKeyType.Done   | 标准样式。     |
+## EnterKeyType枚举说明
+
+| 名称                  | 描述        |
+| ------------------- | --------- |
+| EnterKeyType.Go     | 显示Go文本。   |
+| EnterKeyType.Search | 显示为搜索样式。  |
+| EnterKeyType.Send   | 显示为发送样式。  |
+| EnterKeyType.Next   | 显示为下一个样式。 |
+| EnterKeyType.Done   | 标准样式。     |
 
-- InputType枚举说明
-  | 名称                 | 描述            |
-  | ------------------ | ------------- |
-  | InputType.Normal   | 基本输入模式。       |
-  | InputType.Password | 密码输入模式。       |
-  | InputType.Email    | e-mail地址输入模式。 |
-  | InputType.Number   | 纯数字输入模式。      |
+## InputType枚举说明
 
+| 名称                 | 描述            |
+| ------------------ | ------------- |
+| InputType.Normal   | 基本输入模式。       |
+| InputType.Password | 密码输入模式。       |
+| InputType.Email    | e-mail地址输入模式。 |
+| InputType.Number   | 纯数字输入模式。      |
 
 ## 事件
 
@@ -85,19 +86,20 @@ controller: TextInputController = new TextInputController()
 caretPosition(value:&nbsp;number): void
 
 设置光标移动到指定位置。
-- 参数
 
-  | 参数名   | 参数类型   | 必填   | 默认值  | 参数描述                                     |
-  | ----- | ------ | ---- | ---- | ---------------------------------------- |
-  | value | number | 是    | -    | 设置输入光标的位置。<br/>value：从字符串开始到光标所在位置的字符长度。 |
+**参数：**
 
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述                                     |
+| ----- | ------ | ---- | ---- | ---------------------------------------- |
+| value | number | 是    | -    | 设置输入光标的位置。<br/>value：从字符串开始到光标所在位置的字符长度。 |
 
 ## 示例
 
 
 ### 单行文本输入
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextInputExample1 {
@@ -130,7 +132,8 @@ struct TextInputExample1 {
 
 ### 设置光标
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextInputExample2 {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textpicker.md

 # TextPicker
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 文本类滑动选择器组件。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -23,30 +23,31 @@ TextPicker(value: {range: string[], selected?: number})
 
 根据range指定的选择范围创建文本选择器。
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | range | string[] | 是 | - | 选择器的数据选择范围。 | 
-  | selected | number | 否 | 第一个元素 | 选中项在数组中的index值。 | 
+**参数：**
 
+| 参数名      | 参数类型     | 必填   | 默认值   | 参数描述            |
+| -------- | -------- | ---- | ----- | --------------- |
+| range    | string[] | 是    | -     | 选择器的数据选择范围。     |
+| selected | number   | 否    | 第一个元素 | 选中项在数组中的index值。 |
 
 ## 属性
 
 | 名称                      | 参数类型   | 默认值  | 描述               |
-| -------- | -------- | -------- | -------- |
+| ----------------------- | ------ | ---- | ---------------- |
 | defaultPickerItemHeight | Length | -    | 默认Picker内容项元素高度。 |
 
 
 ## 事件
 
 | 名称                                       | 描述                                       |
-| -------- | -------- |
+| ---------------------------------------- | ---------------------------------------- |
 | onChange(callback:&nbsp;(value:&nbsp;string,&nbsp;index:&nbsp;number)&nbsp;=&gt;&nbsp;void) | 滑动选中TextPicker文本内容后，触发该回调。<br/>-&nbsp;value:&nbsp;当前选中项的文本。<br/>-&nbsp;index:&nbsp;当前选中项的下标。 |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextPickerExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-texttimer.md

 # TextTimer
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 文本计时器组件，支持自定义时间格式。
 
+>  **说明：**
+>
+>  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -17,28 +17,29 @@
 无
 
 
-## 接口说明
+## 接口
 
 TextTimer(options: { isCountDown?: boolean, count?: number, controller?: TextTimerController })
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | isCountDown | boolean | 否 | false | 是否倒计时。 | 
-  | count | number | 否 | 60000 | 倒计时时间（isCountDown为true时生效），单位为毫秒。<br/>-&nbsp;count&lt;=0时，使用默认值为倒计时初始值。<br/>-&nbsp;count&gt;0时，count值为倒计时初始值。 | 
-  | controller | [TextTimerController](#texttimercontroller) | 否 | null | TextTimer控制器。 | 
+**参数：**
+
+| 参数名         | 参数类型                                     | 必填   | 默认值   | 参数描述                                     |
+| ----------- | ---------------------------------------- | ---- | ----- | ---------------------------------------- |
+| isCountDown | boolean                                  | 否    | false | 是否倒计时。                                   |
+| count       | number                                   | 否    | 60000 | 倒计时时间（isCountDown为true时生效），单位为毫秒。<br/>-&nbsp;count&lt;=0时，使用默认值为倒计时初始值。<br/>-&nbsp;count&gt;0时，count值为倒计时初始值。 |
+| controller  | [TextTimerController](#texttimercontroller) | 否    | null  | TextTimer控制器。                            |
 
 ## 属性
 
 | 名称     | 参数类型   | 默认值           | 描述                             |
-| -------- | -------- | -------- | -------- |
+| ------ | ------ | ------------- | ------------------------------ |
 | format | string | 'hh:mm:ss.ms' | 自定义格式，需至少包含一个hh、mm、ss、ms中的关键字。 |
 
 
 ## 事件
 
 | 名称                                       | 功能描述                                     |
-| -------- | -------- |
+| ---------------------------------------- | ---------------------------------------- |
 | onTimer(callback:&nbsp;(utc:&nbsp;number,&nbsp;elapsedTime:&nbsp;number)&nbsp;=&gt;&nbsp;void) | 时间文本发生变化时触发。<br/>utc：当前显示的时间，单位为毫秒。<br/>elapsedTime：计时器经过的时间，单位为毫秒。 |
 
 
@@ -74,7 +75,8 @@ reset()
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TextTimerExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md

 # TimePicker
 
+选择时间的滑动选择器组件。
+
 > **说明：**
+>
 > 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
-选择时间的滑动选择器组件。
-
-
 ## 权限列表
 
 无
@@ -23,30 +23,30 @@ TimePicker(options?: TimePickerOptions)
 
 默认以00：00至23：59的时间区间创建滑动选择器。
 
-- options参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | selected | Date | 否 | 当前系统时间 | 设置选中项的时间。 |
+**参数：**
 
+| 参数名      | 参数类型 | 必填   | 默认值    | 参数描述      |
+| -------- | ---- | ---- | ------ | --------- |
+| selected | Date | 否    | 当前系统时间 | 设置选中项的时间。 |
 
 ## 属性
 
 | 名称              | 参数类型    | 默认值   | 描述                    |
-| -------- | -------- | -------- | -------- |
+| --------------- | ------- | ----- | --------------------- |
 | useMilitaryTime | boolean | false | 展示时间是否为24小时制，不支持动态修改。 |
 
 
 ## 事件
 
 | 名称                                       | 功能描述        |
-| -------- | -------- | 
+| ---------------------------------------- | ----------- |
 | onChange(callback: (value: TimePickerResult ) => void) | 选择时间时触发该事件。 |
 
-### TimePickerResult对象说明
-  | 名称 | 参数类型 | 描述 | 
-  | -------- | -------- | -------- |
-  | hour | number | 选中时间的时。 | 
-  | minute | number | 选中时间的分。 | 
+## TimePickerResult对象说明
+| 名称     | 参数类型   | 描述      |
+| ------ | ------ | ------- |
+| hour   | number | 选中时间的时。 |
+| minute | number | 选中时间的分。 |
 
 
 ## 示例
@@ -54,7 +54,8 @@ TimePicker(options?: TimePickerOptions)
 
 ### 时间选择器
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TimePickerExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-toggle.md

 # Toggle
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -18,25 +19,25 @@
 
 Toggle(options: { type: ToggleType, isOn?: boolean })
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | type | ToggleType | 是 | - | 开关类型。 |
-  | isOn | boolean | 否 | false | 开关是否打开，true：打开，false：关闭。 |
+**参数：**
 
+| 参数名  | 参数类型       | 必填   | 默认值   | 参数描述                     |
+| ---- | ---------- | ---- | ----- | ------------------------ |
+| type | ToggleType | 是    | -     | 开关类型。                    |
+| isOn | boolean    | 否    | false | 开关是否打开，true：打开，false：关闭。 |
 
-- ToggleType枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Checkbox | 提供单选框样式，子组件设置文本不生效，如需文本设置，可将Text和当前组件放入布局组件中。<br>>&nbsp;**说明：**<br/>>&nbsp;[通用属性padding](ts-universal-attributes-size.md)的默认值为：<br>{<br>&nbsp;top: 14 vp,<br>&nbsp;right: 6 vp,<br>&nbsp;bottom: 14 vp,<br>&nbsp;left: 6 vp<br> } |
-  | Button | 提供状态按钮样式，如果有文本设置，则相应的文本内容会显示在按钮内部。 |
-  | Switch | 提供开关样式，子组件设置文本不生效，如需文本设置，可将Text和当前组件放入布局组件中。<br>>&nbsp;**说明：**<br/>>&nbsp;[通用属性padding](ts-universal-attributes-size.md)默认值为：<br>{<br/>&nbsp;top: 12 vp,<br/>&nbsp;right: 12 vp,<br/>&nbsp;bottom: 12 vp,<br/>&nbsp;left: 12 vp<br/> } |
+## ToggleType枚举说明
 
+| 名称       | 描述                                       |
+| -------- | ---------------------------------------- |
+| Checkbox | 提供单选框样式，子组件设置文本不生效，如需文本设置，可将Text和当前组件放入布局组件中。<br>>&nbsp;**说明：**<br/>>&nbsp;[通用属性padding](ts-universal-attributes-size.md)的默认值为：<br>{<br>&nbsp;top: 14 vp,<br>&nbsp;right: 6 vp,<br>&nbsp;bottom: 14 vp,<br>&nbsp;left: 6 vp<br> } |
+| Button   | 提供状态按钮样式，如果有文本设置，则相应的文本内容会显示在按钮内部。       |
+| Switch   | 提供开关样式，子组件设置文本不生效，如需文本设置，可将Text和当前组件放入布局组件中。<br>>&nbsp;**说明：**<br/>>&nbsp;[通用属性padding](ts-universal-attributes-size.md)默认值为：<br>{<br/>&nbsp;top: 12 vp,<br/>&nbsp;right: 12 vp,<br/>&nbsp;bottom: 12 vp,<br/>&nbsp;left: 12 vp<br/> } |
 
 ## 属性
 
 | 名称               | 参数    | 默认值  | 参数描述                                     |
-| -------- | -------- | -------- | -------- |
+| ---------------- | ----- | ---- | ---------------------------------------- |
 | selectedColor    | Color | -    | 设置组件打开状态的背景颜色。                           |
 | switchPointColor | Color | -    | 设置Switch类型的圆形滑块颜色。<br/>>&nbsp;**说明：**<br/>>&nbsp;仅对type为ToggleType.Switch生效。 |
 
@@ -44,13 +45,14 @@ Toggle(options: { type: ToggleType, isOn?: boolean })
 ## 事件
 
 | 名称                                       | 功能描述          |
-| -------- | -------- |
+| ---------------------------------------- | ------------- |
 | onChange(callback:&nbsp;(isOn:&nbsp;boolean)&nbsp;=&gt;&nbsp;void) | 开关状态切换时触发该事件。 |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ToggleExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-web.md

 # Web
 
->![icon-note.gif](public_sys-resources/icon-note.gif) **说明：** 
->该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
 提供具有网页显示能力的Web组件。
 
+> **说明：** 
+>
+> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 ## 权限列表
 访问在线网页时需添加网络权限：ohos.permission.INTERNET
 
@@ -14,25 +15,25 @@
 
 ## 接口
 
--   Web\(options: { src: string, controller?: WebController }\)
+Web\(options: { src: string, controller?: WebController }\)
 
-    表1 options参数说明
-
-    | 参数名        | 参数类型                            | 必填   | 默认值  | 参数描述    |
-    | ---------- | ------------------------------- | ---- | ---- | ------- |
-    | src        | string                          | 是    | -    | 网页资源地址。 |
-    | controller | [WebController](#webcontroller) | 否    | -    | 控制器。    |
+表1 options参数说明
 
+| 参数名        | 参数类型                            | 必填   | 默认值  | 参数描述    |
+| ---------- | ------------------------------- | ---- | ---- | ------- |
+| src        | string                          | 是    | -    | 网页资源地址。 |
+| controller | [WebController](#webcontroller) | 否    | -    | 控制器。    |
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif)**说明：**
+> **说明：**
 >
 > - 不支持转场动画；
 > - 不支持多实例；
 > - 仅支持本地音视频播放。
 
 ## 属性
+
 | 名称                 | 参数类型                                     | 默认值               | 描述                                       |
-| ----------------- | ---------------------------------------- | -------------- | ---------------------------------------- |
+| ------------------ | ---------------------------------------- | ----------------- | ---------------------------------------- |
 | domStorageAccess   | boolean                                  | false             | 设置是否开启文档对象模型存储接口（DOM Storage API）权限，默认未开启。 |
 | fileAccess         | boolean                                  | false             | 设置是否开启通过[$rawfile(filepath/filename)](../../ui/ts-application-resource-access.md#资源引用)访问应用中rawfile路径的文件， 默认启用。 |
 | fileFromUrlAccess  | boolean                                  | true              | 设置是否允许通过网页中的JavaScript脚本访问[$rawfile(filepath/filename)](../../ui/ts-application-resource-access.md#资源引用)的内容，默认未启用。 |
@@ -41,14 +42,14 @@
 | javaScriptAccess   | boolean                                  | true              | 设置是否允许执行JavaScript脚本，默认允许执行。             |
 | mixedMode          | [MixedMode](#mixedmode枚举说明)              | MixedMode.None    | 设置是否允许加载超文本传输协议（HTTP）和超文本传输安全协议（HTTPS）混合内容，默认不允许加载HTTP和HTTPS混合内容。 |
 | onlineImageAccess  | boolean                                  | true              | 设置是否允许从网络加载图片资源（通过HTTP和HTTPS访问的资源），默认允许访问。 |
-| zoomAccess        | boolean                                  | true           | 设置是否支持手势进行缩放，默认允许执行缩放。|
-| overviewModeAccess | boolean                                  | true           | 设置是否使用概览模式加载网页，默认使用该方式。|
-| databaseAccess| boolean                                  | false           | 设置是否开启数据库存储API权限，默认不开启。|
-| cacheMode |  [CacheMode](#cachemode枚举说明) | CacheMode.Default| 设置缓存模式。|
+| zoomAccess         | boolean                                  | true              | 设置是否支持手势进行缩放，默认允许执行缩放。                   |
+| overviewModeAccess | boolean                                  | true              | 设置是否使用概览模式加载网页，默认使用该方式。                  |
+| databaseAccess     | boolean                                  | false             | 设置是否开启数据库存储API权限，默认不开启。                  |
+| cacheMode          | [CacheMode](#cachemode枚举说明)              | CacheMode.Default | 设置缓存模式。                                  |
 | textZoomAtio       | number                                   | 100               | 设置页面的文本缩放百分比，默认为100%。                    |
 | userAgent          | string                                   | -                 | 设置用户代理。                                  |
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 >
 >  通用属性仅支持[width](ts-universal-attributes-size.md#属性)、[height](ts-universal-attributes-size.md#属性)、[padding](ts-universal-attributes-size.md#属性)、[margin](ts-universal-attributes-size.md#属性)、[border](ts-universal-attributes-border.md#属性)。
 
@@ -57,7 +58,7 @@
 不支持通用事件。
 
 | 名称                                       | 功能描述                                     |
-| ------------------------------------------------------------ | ------------------------------------------------------------ |
+| ---------------------------------------- | ---------------------------------------- |
 | onAlert(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | <p>网页触发alert()告警弹窗时触发回调。<br />当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（只有确认场景），并且根据用户的确认操作调用JsResult通知Web组件。<br />- url：当前显示弹窗所在网页的URL。<br />- message：弹窗中显示的信息。<br />- result：通知Web组件用户操作行为。</p> |
 | onBeforeUnload(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | <p>刷新或关闭场景下，在即将离开当前页面时触发此回调。<br />当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（包括确认和取消），并且需要根据用户的确认或取消操作调用JsResult通知Web组件最终是否离开当前页面。<br />- url：当前显示弹窗所在网页的URL。<br />- message：弹窗中显示的信息。<br />- result：通知Web组件用户操作行为。</p> |
 | onConfirm(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | <p>网页调用confirm()告警时触发此回调。<br />当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（包括确认和取消），并且需要根据用户的确认或取消操作调用JsResult通知Web组件。<br />- url：当前显示弹窗所在网页的URL。<br />- message：弹窗中显示的信息。<br />- result：通知Web组件用户操作行为。</p> |
@@ -77,7 +78,7 @@
 ## ConsoleMessage对象说明
 
 | 接口名称                                     | 功能描述                   |
-| ------------------------------- | ---------------------- |
+| ---------------------------------------- | ---------------------- |
 | getLineNumber(): number                  | 获取ConsoleMessage的行数。   |
 | getMessage(): string                     | 获取ConsoleMessage的日志信息。 |
 | getMessageLevel(): [MessageLevel](#messagelevel枚举说明) | 获取ConsoleMessage的信息级别。 |
@@ -145,7 +146,7 @@ Web组件返回的请求/响应头对象。
 onRenderExited接口返回的渲染进程退出的具体原因。
 
 | 名称                           | 描述                |
-| ---------------------------- | ------------------------------ |
+| ---------------------------- | ----------------- |
 | PROCESS_ABNORMAL_TERMINATION | 渲染进程异常退出。         |
 | PROCESS_WAS_KILLED           | 收到SIGKILL，或被手动终止。 |
 | PROCESS_CRASHED              | 渲染进程崩溃退出，如段错误。    |
@@ -162,7 +163,7 @@ onRenderExited接口返回的渲染进程退出的具体原因。
 
 ## CacheMode枚举说明
 | 名称      | 描述                                   |
-| ---------- | ---------------------------------- |
+| ------- | ------------------------------------ |
 | Default | 使用未过期的cache加载资源，如果cache中无该资源则从网络中获取。 |
 | None    | 加载资源使用cache，如果cache中无该资源则从网络中获取。     |
 | Online  | 加载资源不使用cache，全部从网络中获取。               |
@@ -172,12 +173,12 @@ onRenderExited接口返回的渲染进程退出的具体原因。
 通知Web组件的文件选择结果。
 
 | 接口名称                                     | 功能描述                                   |
-| ---------------------------------------------- | ------------------------------------------------------------ |
+| ---------------------------------------- | -------------------------------------- |
 | handleFileList(fileList: Array\<string>): void | 通知Web组件进行文件选择操作。fileList: 需要进行操作的文件列表。 |
 
 ## FileSelectorParam对象说明
 | 接口名称                          | 功能描述         |
-| ---------------------------------------- | ------------------ |
+| ----------------------------- | ------------ |
 | title(): string               | 获取文件选择器标题。   |
 | mode(): FileSelectorMode      | 获取文件选择器的模式。  |
 | accpetType(): Array\<string\> | 获取文件过滤类型。    |
@@ -185,7 +186,7 @@ onRenderExited接口返回的渲染进程退出的具体原因。
 
 ## FileSelectorMode枚举说明
 | 名称                      | 描述         |
-| ---------------------------- | ------------------------------ |
+| ----------------------- | ---------- |
 | FILE_OPEN_MODE          | 打开上传单个文件。  |
 | FILE_OPEN_MULTIPLE_MODE | 打开上传多个文件。  |
 | FILE_OPEN_FOLDER_MODE   | 打开上传文件夹模式。 |
@@ -374,7 +375,7 @@ getCookieManager(): WebCookie
 获取web组件cookie管理对象。
 - 返回值
   | 参数类型      | 说明                                       |
-  | ------- | --------- |
+  | --------- | ---------------------------------------- |
   | WebCookie | web组件cookie管理对象，参考[WebCookie](#webcookie)定义。 |
 ## WebCookie
 通过WebCookie可以控制Web组件中的cookie的各种行为，其中每个应用中的所有web组件共享一个WebCookie。通过controller方法中的getCookieManager方法可以获取WebCookie对象，进行后续的cookie管理操作。
@@ -386,12 +387,12 @@ setCookie(url: string, value: string): boolean
 - 参数说明
 
   | 参数名   | 参数类型   | 必填   | 默认值  | 参数描述              |
-  | -------- | ------------------------ | ---- | ---- | ---------------------------------------- |
+  | ----- | ------ | ---- | ---- | ----------------- |
   | url   | string | 是    | -    | 要设置的cookie所属的url。 |
   | value | string | 是    | -    | cookie的值。         |
 - 返回值 
   | 参数类型    | 说明            |
-  | ------- | --------- |
+  | ------- | ------------- |
   | boolean | 设置cookie是否成功。 |
 
 ### saveCookieSync
@@ -400,7 +401,7 @@ saveCookieSync(): boolean
 将当前存在内存中的cookie同步到磁盘中，该方法为同步方法。
 - 返回值
   | 参数类型    | 说明                   |
-  | ------- | --------- |
+  | ------- | -------------------- |
   | boolean | 同步内存cookie到磁盘操作是否成功。 |
 ## 示例
 

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-xcomponent.md

 # XComponent
 
-  > ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-  > 该组件从API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
  可用于EGL/OpenGLES和媒体数据写入，并显示在XComponent组件。
 
+  >  **说明：**
+  >
+  >  该组件从API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 ## 权限列表
 
   无
@@ -17,20 +18,19 @@
 
  XComponent\(value: {id: string, type: string, libraryname?: string, controller?: XComponentController}\)
 
-  - 参数
-
-    | 名称        | 参数类型                                      | 必填 | 描述                                                         |
-    | ----------- | --------------------------------------------- | ---- | ------------------------------------------------------------ |
-    | id          | string                                        | 是   | 组件的唯一标识，支持最大的字符串长度128。                    |
-    | type        | string                                        | 是   | 用于指定XComponent组件类型，可选值为：<br/>-surface：组件内容单独送显，直接合成到屏幕。<br/>-component：组件内容与其他组件合成后统一送显。|
-    | libraryname | string                                        | 否   | 应用Native层编译输出动态库名称。                             |
-    | controller  | [XComponentController](#XComponentController) | 否   | 给组件绑定一个控制器，通过控制器调用组件方法。               |
+**参数：**
 
+| 名称          | 参数类型                                     | 必填   | 描述                                       |
+| ----------- | ---------------------------------------- | ---- | ---------------------------------------- |
+| id          | string                                   | 是    | 组件的唯一标识，支持最大的字符串长度128。                   |
+| type        | string                                   | 是    | 用于指定XComponent组件类型，可选值为：<br/>-surface：组件内容单独送显，直接合成到屏幕。<br/>-component：组件内容与其他组件合成后统一送显。 |
+| libraryname | string                                   | 否    | 应用Native层编译输出动态库名称。                      |
+| controller  | [XComponentController](#XComponentController) | 否    | 给组件绑定一个控制器，通过控制器调用组件方法。                  |
 
 ## 事件
 
 | 名称                               | 功能描述         |
-| ------------------------------- | ------------------------ |
+| -------------------------------- | ------------ |
 | onLoad(context?: object) => void | 插件加载完成时回调事件。 |
 | onDestroy() => void              | 插件卸载完成时回调事件。 |
 
@@ -50,11 +50,11 @@ getXComponentSurfaceId(): string
 
 获取XComponent对应Surface的ID，供@ohos接口使用，比如camera相关接口。
 
-  - 返回值
+**返回值：**
 
-    | 类型   | 描述                        |
-    | ------ | --------------------------- |
-    | string | XComponent持有Surface的ID。 |
+| 类型     | 描述                      |
+| ------ | ----------------------- |
+| string | XComponent持有Surface的ID。 |
 
 ### setXComponentSurfaceSize
 
@@ -62,12 +62,12 @@ setXComponentSurfaceSize(value: {surfaceWidth: number, surfaceHeight: number}):
 
 设置XComponent持有Surface的宽度和高度。
 
-- 参数
+**参数：**
 
-  | 参数名        | 参数类型 | 必填 | 默认值 | 描述                          |
-  | ------------- | -------- | ---- | ------ | ----------------------------- |
-  | surfaceWidth  | number   | 是   | -      | XComponent持有Surface的宽度。 |
-  | surfaceHeight | number   | 是   | -      | XComponent持有Surface的高度。 |
+| 参数名           | 参数类型   | 必填   | 默认值  | 描述                      |
+| ------------- | ------ | ---- | ---- | ----------------------- |
+| surfaceWidth  | number | 是    | -    | XComponent持有Surface的宽度。 |
+| surfaceHeight | number | 是    | -    | XComponent持有Surface的高度。 |
 
 ### getXComponentContext
 
@@ -75,18 +75,18 @@ getXComponentContext(): Object
 
 获取XComponent实例对象的context。
 
-- 返回值
+**返回值：**
 
-  | 类型   | 描述                                                         |
-  | ------ | ------------------------------------------------------------ |
-  | Object | 获取XComponent实例对象的context，context包含的具体接口方法由开发者自定义。 |
+| 类型     | 描述                                       |
+| ------ | ---------------------------------------- |
+| Object | 获取XComponent实例对象的context，context包含的具体接口方法由开发者自定义。 |
 
 ## 示例
 
 提供surface类型XComponent，支持相机预览等能力。  
 示例效果请以真机运行为准，当前IDE预览器不支持。
 
-```
+```ts
 import camera from '@ohos.multimedia.camera';
 @Entry
 @Component

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-longpressgesture.md

 # LongPressGesture
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,31 +14,32 @@
 
 LongPressGesture(options?: { fingers?: number, repeat?: boolean, duration?: number })
 
-- 参数
-  | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | fingers | number | 否 | 1 | 触发长按的最少手指数，最小为1指， 最大取值为10指。 | 
-  | repeat | boolean | 否 | false | 是否连续触发事件回调。 | 
-  | duration | number | 否 | 500 | 最小触发长按的时间，单位为毫秒（ms）。 | 
+**参数：**
 
+| 参数名称     | 参数类型    | 必填   | 默认值   | 参数描述                             |
+| -------- | ------- | ---- | ----- | -------------------------------- |
+| fingers  | number  | 否    | 1     | 触发长按的最少手指数，最小为1指， 最大取值为10指。 |
+| repeat   | boolean | 否    | false | 是否连续触发事件回调。                      |
+| duration | number  | 否    | 500   | 最小触发长按的时间，单位为毫秒（ms）。             |
 
 ## 事件
 
 | 名称                                       | 功能描述                           |
-| -------- | -------- | 
+| ---------------------------------------- | ------------------------------ |
 | onAction((event?: GestureEvent) => void) | LongPress手势识别成功回调。             |
 | onActionEnd((event?: GestureEvent) => void) | LongPress手势识别成功，手指抬起后触发回调。     |
 | onActionCancel(event: () => void) | LongPress手势识别成功，接收到触摸取消事件触发回调。 |
 
-- GestureEvent对象中与LongPress手势相关的属性
-  | 属性名称 | 属性类型 | 描述 | 
-  | -------- | -------- | -------- |
-  | repeat | boolean | 事件是否为重复触发事件。 | 
+## GestureEvent对象中与LongPress手势相关的属性
 
+| 属性名称   | 属性类型    | 描述           |
+| ------ | ------- | ------------ |
+| repeat | boolean | 事件是否为重复触发事件。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct LongPressGestureExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md

 # PanGesture
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,62 +14,65 @@
 
 PanGesture(options?: { fingers?: number, direction?: PanDirection, distance?: number } | [PanGestureOptions](#pangestureoptions))
 
-- 参数
-  | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | fingers | number | 否 | 1 | 触发滑动的最少手指数，最小为1指， 最大取值为10指。 |
-  | direction | PanDirection | 否 | All | 设置滑动方向，此枚举值支持逻辑与(&)和逻辑或（\|）运算。 |
-  | distance | number | 否 | 5.0 | 最小滑动识别距离，单位为vp。 |
+**参数：**
 
-- PanDirection枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | All | 所有方向可滑动。 | 
-  | Horizontal | 水平方向可滑动。 | 
-  | Vertical | 竖直方向可滑动。 | 
-  | Left | 向左滑动。 | 
-  | Right | 向右滑动。 | 
-  | Up | 向上滑动。 | 
-  | Down | 向下滑动。 | 
-  | None | 任何方向都不可滑动。 | 
+| 参数名称      | 参数类型         | 必填   | 默认值  | 参数描述                               |
+| --------- | ------------ | ---- | ---- | ---------------------------------- |
+| fingers   | number       | 否    | 1    | 触发滑动的最少手指数，最小为1指， 最大取值为10指。   |
+| direction | PanDirection | 否    | All  | 设置滑动方向，此枚举值支持逻辑与(&)和逻辑或（\|）运算。 |
+| distance  | number       | 否    | 5.0  | 最小滑动识别距离，单位为vp。                    |
 
+## PanDirection枚举说明
 
-### PanGestureOptions
+| 名称         | 描述         |
+| ---------- | ---------- |
+| All        | 所有方向可滑动。   |
+| Horizontal | 水平方向可滑动。   |
+| Vertical   | 竖直方向可滑动。   |
+| Left       | 向左滑动。      |
+| Right      | 向右滑动。      |
+| Up         | 向上滑动。      |
+| Down       | 向下滑动。      |
+| None       | 任何方向都不可滑动。 |
+
+## PanGestureOptions
 
 通过PanGestureOptions对象接口可以动态修改滑动手势识别器的属性，从而避免通过状态变量修改属性（状态变量修改会导致UI刷新）。
 
 PanGestureOptions(options?: { fingers?: number, direction?: PanDirection, distance?: number })
 
-- 参数
-  同PanGesture参数说明。
+**参数：**
+
+同PanGesture参数说明。
 
-- 接口
-  | 名称 | 功能描述 | 
-  | -------- | -------- |
-  | setDirection(value: PanDirection) | 设置direction属性。 | 
-  | setDistance(value: number) | 设置distance属性。 | 
-  | setFingers(value: number) | 设置fingers属性。 | 
+**接口：**
 
+| 名称                                     | 功能描述           |
+| -------------------------------------- | -------------- |
+| setDirection(value: PanDirection) | 设置direction属性。 |
+| setDistance(value: number)        | 设置distance属性。  |
+| setFingers(value: number)         | 设置fingers属性。   |
 
 ## 事件
 
 | 名称                                       | 功能描述                     |
-| -------- | -------- | 
+| ---------------------------------------- | ------------------------ |
 | onActionStart(callback: (event?: GestureEvent) => void) | Pan手势识别成功回调。             |
 | onActionUpdate(callback: (event?: GestureEvent) => void) | Pan手势移动过程中回调。            |
 | onActionEnd(callback: (event?: GestureEvent) => void) | Pan手势识别成功，手指抬起后触发回调。     |
 | onActionCancel(callback: () => void) | Pan手势识别成功，接收到触摸取消事件触发回调。 |
 
-- GestureEvent对象中与Pan手势相关的属性
-  | 属性名称 | 属性类型 | 描述 | 
-  | -------- | -------- | -------- |
-  | offsetX | number | 手势事件偏移量，单位为vp。 | 
-  | offsetY | number | 手势事件偏移量，单位为vp。 | 
+## GestureEvent对象中与Pan手势相关的属性
 
+| 属性名称    | 属性类型   | 描述             |
+| ------- | ------ | -------------- |
+| offsetX | number | 手势事件偏移量，单位为vp。 |
+| offsetY | number | 手势事件偏移量，单位为vp。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct PanGestureExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pinchgesture.md

 # PinchGesture
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,33 +14,34 @@
 
 PinchGesture(options?: { fingers?: number, distance?: number })
 
-- 参数
-  | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | fingers | number | 否 | 2 | 触发捏合的最少手指数, 最小为2指，最大为5指。 |
-  | distance | number | 否 | 3.0 | 最小识别距离，单位为vp。 |
+**参数：**
 
+| 参数名称     | 参数类型   | 必填   | 默认值  | 参数描述                          |
+| -------- | ------ | ---- | ---- | ----------------------------- |
+| fingers  | number | 否    | 2    | 触发捏合的最少手指数, 最小为2指，最大为5指。 |
+| distance | number | 否    | 3.0  | 最小识别距离，单位为vp。                 |
 
 ## 事件
 
 | 名称                                       | 功能描述                       |
-| -------- | -------- |
+| ---------------------------------------- | -------------------------- |
 | onActionStart((event?: GestureEvent) => void) | Pinch手势识别成功回调。             |
 | onActionUpdate((event?: GestureEvent) => void) | Pinch手势移动过程中回调。            |
 | onActionEnd((event?: GestureEvent) => void) | Pinch手势识别成功，手指抬起后触发回调。     |
 | onActionCancel(event: () => void) | Pinch手势识别成功，接收到触摸取消事件触发回调。 |
 
-- GestureEvent对象中与Pinch手势相关的属性
-  | 属性名称 | 属性类型 | 描述 |
-  | -------- | -------- | -------- |
-  | scale | number | 缩放比例，用于PinchGesture手势触发场景。 |
-  | pinchCenterX | number | 捏合手势中心点X轴坐标，单位为px。 |
-  | pinchCenterY | number | 捏合手势中心点Y轴坐标，单位为px。 |
+## GestureEvent对象中与Pinch手势相关的属性
 
+| 属性名称         | 属性类型   | 描述                         |
+| ------------ | ------ | -------------------------- |
+| scale        | number | 缩放比例，用于PinchGesture手势触发场景。 |
+| pinchCenterX | number | 捏合手势中心点X轴坐标，单位为px。         |
+| pinchCenterY | number | 捏合手势中心点Y轴坐标，单位为px。         |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct PinchGestureExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-rotationgesture.md

 # RotationGesture
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,31 +14,32 @@
 
 RotationGesture(options?: { fingers?: number, angle?: number })
 
-- 参数
-  | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | fingers | number | 否 | 2 | 触发旋转的最少手指数, 最小为2指，最大为5指。 | 
-  | angle | number | 否 | 1.0 | 触发旋转手势的最小改变度数，单位为度数。 | 
+**参数：**
 
+| 参数名称    | 参数类型   | 必填   | 默认值  | 参数描述                          |
+| ------- | ------ | ---- | ---- | ----------------------------- |
+| fingers | number | 否    | 2    | 触发旋转的最少手指数, 最小为2指，最大为5指。 |
+| angle   | number | 否    | 1.0  | 触发旋转手势的最小改变度数，单位为度数。          |
 
 ## 事件
 
 | 名称                                       | 功能描述                          |
-| -------- | -------- |
+| ---------------------------------------- | ----------------------------- |
 | onActionStart((event?: GestureEvent) => void) | Rotation手势识别成功回调。             |
 | onActionUpdate((event?: GestureEvent) => void) | Rotation手势移动过程中回调。            |
 | onActionEnd((event?: GestureEvent) => void) | Rotation手势识别成功，手指抬起后触发回调。     |
 | onActionCancel(event: () => void) | Rotation手势识别成功，接收到触摸取消事件触发回调。 |
 
-- GestureEvent对象中与Rotation手势相关的属性
-  | 属性名称 | 属性类型 | 描述 | 
-  | -------- | -------- | -------- |
-  | angle | number | 旋转角度。 | 
+## GestureEvent对象中与Rotation手势相关的属性
 
+| 属性名称  | 属性类型   | 描述    |
+| ----- | ------ | ----- |
+| angle | number | 旋转角度。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RotationGestureExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-swipegesture.md

 # SwipeGesture
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,38 +14,40 @@
 
 SwipeGesture(value?: { fingers?: number; direction?: SwipeDirection; speed?: number })
 
-- 参数
-  | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | fingers | number | 否 | 1 | 触发滑动的最少手指数，默认为1，最小为1指，最大为10指。 |
-  | direction | SwipeDirection | 否 | SwipeDirection.All | 滑动方向。 |
-  | speed | number | 否 | 100 | 识别滑动的最小速度（100VP/秒）。 |
+**参数：**
 
-- SwipeDirection枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | All | 所有方向。 | 
-  | Horizontal | 水平方向。 | 
-  | Vertical | 竖直方向。 | 
+| 参数名称      | 参数类型           | 必填   | 默认值                | 参数描述                          |
+| --------- | -------------- | ---- | ------------------ | ----------------------------- |
+| fingers   | number         | 否    | 1                  | 触发滑动的最少手指数，默认为1，最小为1指，最大为10指。 |
+| direction | SwipeDirection | 否    | SwipeDirection.All | 滑动方向。                         |
+| speed     | number         | 否    | 100                | 识别滑动的最小速度（100VP/秒）。           |
 
+## SwipeDirection枚举说明
+
+| 名称         | 描述    |
+| ---------- | ----- |
+| All        | 所有方向。 |
+| Horizontal | 水平方向。 |
+| Vertical   | 竖直方向。 |
 
 ## 事件
 
 | 名称                                       | 功能描述        |
-| -------- | -------- |
+| ---------------------------------------- | ----------- |
 | onAction(callback:(event?: GestureEvent) => void) | 滑动手势识别成功回调。 |
 
+## GestureEvent对象中与Swipe手势相关的属性
 
-- GestureEvent对象中与Swipe手势相关的属性
-  | 参数名 | 类型 | 说明 | 
-  | -------- | -------- | -------- |
-  | angle | number | 滑动手势的角度，即两根手指间的线段与水平方向的夹角变化的度数。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;角度计算方式：滑动手势被识别到后，连接两根手指之间的线被识别为起始线条，随着手指的滑动，手指之间的线条会发生旋转，根据起始线条两端点和当前线条两端点的坐标，使用反正切函数分别计算其相对于水平方向的夹角，最后arctan2(cy2-cy1,cx2-cx1)-arctan2(y2-y1,x2-x1)为旋转的角度。以起始线条为坐标系，顺时针旋转为0到180度，逆时针旋转为-180到0度。 | 
-  | speed | number | 滑动手势的速度，是所有手指滑动的平均速度，单位为VP/秒。 | 
+| 参数名   | 类型     | 说明                                       |
+| ----- | ------ | ---------------------------------------- |
+| angle | number | 滑动手势的角度，即两根手指间的线段与水平方向的夹角变化的度数。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;角度计算方式：滑动手势被识别到后，连接两根手指之间的线被识别为起始线条，随着手指的滑动，手指之间的线条会发生旋转，根据起始线条两端点和当前线条两端点的坐标，使用反正切函数分别计算其相对于水平方向的夹角，最后arctan2(cy2-cy1,cx2-cx1)-arctan2(y2-y1,x2-x1)为旋转的角度。以起始线条为坐标系，顺时针旋转为0到180度，逆时针旋转为-180到0度。 |
+| speed | number | 滑动手势的速度，是所有手指滑动的平均速度，单位为VP/秒。            |
 
 ![zh-cn_image_0000001231374559](figures/zh-cn_image_0000001231374661.png)
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct SwipeGestureExample {

zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md

 # TapGesture
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,23 +14,24 @@
 
 TapGesture(options?: { count?: number, fingers?: number })
 
-- 参数
-  | 参数名称 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | count | number | 否 | 1 | 识别的连续点击次数。如果设置小于1，会被转化为默认值。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;如配置多击，上一次抬起和下一次按下的超时时间为300毫秒（ms）。 | 
-  | fingers | number | 否 | 1 | 触发点击的最少手指数，最小为1指，&nbsp;最大为10指。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;1.&nbsp;当配置多指时，第一根手指按下后300毫秒（ms）内未有足够的手指数按下，手势识别失败。<br/>>&nbsp;<br/>>&nbsp;2.&nbsp;实际点击手指数超过配置值，手势识别失败。 | 
+**参数：**
 
+| 参数名称    | 参数类型   | 必填   | 默认值  | 参数描述                                     |
+| ------- | ------ | ---- | ---- | ---------------------------------------- |
+| count   | number | 否    | 1    | 识别的连续点击次数。如果设置小于1，会被转化为默认值。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;如配置多击，上一次抬起和下一次按下的超时时间为300毫秒（ms）。 |
+| fingers | number | 否    | 1    | 触发点击的最少手指数，最小为1指，&nbsp;最大为10指。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;1.&nbsp;当配置多指时，第一根手指按下后300毫秒（ms）内未有足够的手指数按下，手势识别失败。<br/>>&nbsp;<br/>>&nbsp;2.&nbsp;实际点击手指数超过配置值，手势识别失败。 |
 
 ## 事件
 
 | 名称                                       | 功能描述         |
-| -------- | -------- | 
+| ---------------------------------------- | ------------ |
 | onAction((event?:&nbsp;[GestureEvent](ts-gesture-settings.md))&nbsp;=&gt;&nbsp;void) | Tap手势识别成功回调。 |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TapGestureExample {

zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md

 # 组合手势
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,30 +14,32 @@
 
 GestureGroup(mode: GestureMode, ...gesture: GestureType[])
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | mode | GestureMode                                                  | 是 | - | 设置组合手势识别模式。 |
-  | gesture | [TapGesture](ts-basic-gestures-tapgesture.md)<br/>\|&nbsp;[LongPressGesture](ts-basic-gestures-longpressgesture.md)<br/>\|&nbsp;[PanGesture](ts-basic-gestures-pangesture.md)<br/>\|&nbsp;[PinchGesture](ts-basic-gestures-pinchgesture.md)<br/>\|&nbsp;[RotationGesture](ts-basic-gestures-rotationgesture.md) | 是 | - | 可变长参数，1个或者多个基础手势类型，这些手势会被组合识别。 |
+**参数：**
 
-- GestureMode枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Sequence | 顺序识别，按照手势的注册顺序识别手势，直到所有手势识别成功。当有一个手势识别失败时，所有手势识别失败。 |
-  | Parallel | 并发识别，注册的手势同时识别，直到所有手势识别结束，手势识别互相不影响。 |
-  | Exclusive | 互斥识别，注册的手势同时识别，若有一个手势识别成功，则结束手势识别。 |
+| 参数名     | 参数类型                                     | 必填   | 默认值  | 参数描述                           |
+| ------- | ---------------------------------------- | ---- | ---- | ------------------------------ |
+| mode    | GestureMode                              | 是    | -    | 设置组合手势识别模式。                    |
+| gesture | [TapGesture](ts-basic-gestures-tapgesture.md)<br/>\|&nbsp;[LongPressGesture](ts-basic-gestures-longpressgesture.md)<br/>\|&nbsp;[PanGesture](ts-basic-gestures-pangesture.md)<br/>\|&nbsp;[PinchGesture](ts-basic-gestures-pinchgesture.md)<br/>\|&nbsp;[RotationGesture](ts-basic-gestures-rotationgesture.md) | 是    | -    | 可变长参数，1个或者多个基础手势类型，这些手势会被组合识别。 |
 
+## GestureMode枚举说明
+
+| 名称        | 描述                                       |
+| --------- | ---------------------------------------- |
+| Sequence  | 顺序识别，按照手势的注册顺序识别手势，直到所有手势识别成功。当有一个手势识别失败时，所有手势识别失败。 |
+| Parallel  | 并发识别，注册的手势同时识别，直到所有手势识别结束，手势识别互相不影响。     |
+| Exclusive | 互斥识别，注册的手势同时识别，若有一个手势识别成功，则结束手势识别。       |
 
 ## 事件
 
 | 名称                                       | 功能描述                                 |
-| -------- | -------- |
+| ---------------------------------------- | ------------------------------------ |
 | onCancel(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 顺序组合手势（GestureMode.Sequence）取消后触发回调。 |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct GestureGroupExample {

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md

 #  Canvas
 
-> ![img](public_sys-resources/icon-note.gif) **说明：** 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+> **说明：** 
+>
+> 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 提供画布组件，用于自定义绘制图形。
 
@@ -16,11 +18,11 @@
 
 Canvas(context: CanvasRenderingContext2D)
 
-- 参数
+**参数：**
 
-  | 参数名     | 参数类型                                     | 必填   | 默认值  | 参数描述                         |
-  | ------- | ---------------------------------------- | ---- | ---- | ---------------------------- |
-  | context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | 是    | -    | 见CanvasRenderingContext2D对象。 |
+| 参数名     | 参数类型                                     | 必填   | 默认值  | 参数描述                         |
+| ------- | ---------------------------------------- | ---- | ---- | ---------------------------- |
+| context | [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md) | 是    | -    | 见CanvasRenderingContext2D对象。 |
 
 ## 属性
 
@@ -36,7 +38,8 @@ Canvas(context: CanvasRenderingContext2D)
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct CanvasExample {

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md

 # CanvasGradient对象
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -13,17 +14,19 @@ addColorStop(offset: number, color: string): void
 
 设置渐变断点值，包括偏移和颜色。
 
-- 参数
-  | 参数 | 类型 | 必填 | 默认值 | 描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | offset | number | 是 | 0 | 设置渐变点距离起点的位置占总体长度的比例，范围为0到1。 | 
-  | color | string | 是 | 'ffffff' | 设置渐变的颜色。 | 
-
-- 示例
-  ```
-  @Entry
-  @Component
-  struct Page45 {
+**参数：**
+
+| 参数     | 类型     | 必填   | 默认值      | 描述                           |
+| ------ | ------ | ---- | -------- | ---------------------------- |
+| offset | number | 是    | 0        | 设置渐变点距离起点的位置占总体长度的比例，范围为0到1。 |
+| color  | string | 是    | 'ffffff' | 设置渐变的颜色。                     |
+
+**示例：**
+
+```ts
+@Entry
+@Component
+struct Page45 {
   private settings: RenderingContextSettings = new RenderingContextSettings(true)
   private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
 
@@ -45,7 +48,7 @@ addColorStop(offset: number, color: string): void
     .width('100%')
     .height('100%')
   }
-  }
-  ```
+}
+```
 
-  ![zh-cn_image_0000001194032516](figures/zh-cn_image_0000001194032516.png)
+![zh-cn_image_0000001194032516](figures/zh-cn_image_0000001194032516.png)
\ No newline at end of file

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md

 # ImageBitmap对象
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -10,7 +11,7 @@ CanvasImageData对象可以存储canvas渲染的像素数据。
 ## 属性
 
 | 属性     | 类型                        | 描述                           |
-| -------- | -------- | -------- |
+| ------ | ------------------------- | ---------------------------- |
 | width  | number                    | 矩形区域实际像素宽度。                  |
 | height | number                    | 矩形区域实际像素高度。                  |
 | data   | <Uint8ClampedArray> | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagedata.md

 # ImageData对象
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -10,7 +11,7 @@ ImageData对象可以存储canvas渲染的像素数据。
 ## 属性
 
 | 属性     | 类型                        | 描述                           |
-| -------- | -------- | -------- |
+| ------ | ------------------------- | ---------------------------- |
 | width  | number                    | 矩形区域实际像素宽度。                  |
 | height | number                    | 矩形区域实际像素高度。                  |
 | data   | <Uint8ClampedArray> | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md

 # Lottie
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -15,7 +16,7 @@
 import lottie from '@ohos/lottieETS'
 ```
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 >  在Terminal窗口使用 `npm install @ohos/lottieETS` 命令下载Lottie。
 
 

zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md

 # Path2D对象
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -15,7 +16,7 @@ addPath(path: Object): void
 
 - 参数
   | 参数   | 类型     | 必填   | 默认值  | 描述             |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ---- | ------ | ---- | ---- | -------------- |
   | path | Object | 是    | null | 需要添加到当前路径的路径对象 |
 
 - 示例
@@ -95,7 +96,7 @@ moveTo(x: number, y: number): void
 
 - 参数
   | 参数   | 类型     | 必填   | 默认值  | 描述      |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ---- | ------ | ---- | ---- | ------- |
   | x    | number | 是    | 0    | 目标点X轴坐标 |
   | y    | number | 是    | 0    | 目标点Y轴坐标 |
 
@@ -139,7 +140,7 @@ lineTo(x: number, y: number): void
 
 - 参数
   | 参数   | 类型     | 必填   | 默认值  | 描述      |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ---- | ------ | ---- | ---- | ------- |
   | x    | number | 是    | 0    | 目标点X轴坐标 |
   | y    | number | 是    | 0    | 目标点Y轴坐标 |
 
@@ -184,7 +185,7 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
 
 - 参数
   | 参数   | 类型     | 必填   | 默认值  | 描述             |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ---- | ------ | ---- | ---- | -------------- |
   | cp1x | number | 是    | 0    | 第一个贝塞尔参数的x坐标值。 |
   | cp1y | number | 是    | 0    | 第一个贝塞尔参数的y坐标值。 |
   | cp2x | number | 是    | 0    | 第二个贝塞尔参数的x坐标值。 |
@@ -229,7 +230,7 @@ quadraticCurveTo(cpx: number, cpy: number, x: number ,y: number): void
 
 - 参数
   | 参数   | 类型     | 必填   | 默认值  | 描述          |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ---- | ------ | ---- | ---- | ----------- |
   | cpx  | number | 是    | 0    | 贝塞尔参数的x坐标值。 |
   | cpy  | number | 是    | 0    | 贝塞尔参数的y坐标值。 |
   | x    | number | 是    | 0    | 路径结束时的x坐标值。 |
@@ -273,7 +274,7 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
 
 - 参数
   | 参数            | 类型      | 必填   | 默认值   | 描述         |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ------------- | ------- | ---- | ----- | ---------- |
   | x             | number  | 是    | 0     | 弧线圆心的x坐标值。 |
   | y             | number  | 是    | 0     | 弧线圆心的y坐标值。 |
   | radius        | number  | 是    | 0     | 弧线的圆半径。    |
@@ -317,7 +318,7 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
 
 - 参数
   | 参数     | 类型     | 必填   | 默认值  | 描述              |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ------ | ------ | ---- | ---- | --------------- |
   | x1     | number | 是    | 0    | 圆弧经过的第一个点的x坐标值。 |
   | y1     | number | 是    | 0    | 圆弧经过的第一个点的y坐标值。 |
   | x2     | number | 是    | 0    | 圆弧经过的第二个点的x坐标值。 |
@@ -361,7 +362,7 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
 
 - 参数
   | 参数            | 类型     | 必填   | 默认值  | 描述                                   |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ------------- | ------ | ---- | ---- | ------------------------------------ |
   | x             | number | 是    | 0    | 椭圆圆心的x轴坐标。                           |
   | y             | number | 是    | 0    | 椭圆圆心的y轴坐标。                           |
   | radiusX       | number | 是    | 0    | 椭圆x轴的半径长度。                           |
@@ -408,7 +409,7 @@ rect(x: number, y: number, width: number, height: number): void
 
 - 参数
   | 参数     | 类型     | 必填   | 默认值  | 描述            |
-  | -------- | -------- | -------- | -------- | -------- |
+  | ------ | ------ | ---- | ---- | ------------- |
   | x      | number | 是    | 0    | 指定矩形的左上角x坐标值。 |
   | y      | number | 是    | 0    | 指定矩形的左上角y坐标值。 |
   | width  | number | 是    | 0    | 指定矩形的宽度。      |

zh-cn/application-dev/reference/arkui-ts/ts-container-alphabet-indexer.md

 # AlphabetIndexer
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 字母索引条。
 
-
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 ## 权限列表
 
@@ -22,17 +20,17 @@
 
 AlphabetIndexer(value: {arrayValue : Array<string>, selected : number})
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | arrayValue | Array<string> | 是 | - | 字母索引字符串数组。 | 
-  | selected | number | 是 | - | 选中项编号。 | 
+**参数：**
 
+| 参数名        | 参数类型                | 必填   | 默认值  | 参数描述       |
+| ---------- | ------------------- | ---- | ---- | ---------- |
+| arrayValue | Array<string> | 是    | -    | 字母索引字符串数组。 |
+| selected   | number              | 是    | -    | 选中项编号。     |
 
 ## 属性
 
 | 名称                      | 参数类型                                     | 描述                                  |
-| -------- | -------- | -------- |
+| ----------------------- | ---------------------------------------- | ----------------------------------- |
 | selectedColor           | Color                                    | 选中文本文字颜色。                           |
 | popupColor              | Color                                    | 弹出提示文本字体颜色。                         |
 | selectedBackgroundColor | Color                                    | 选中文本背景颜色。                           |
@@ -44,18 +42,18 @@ AlphabetIndexer(value: {arrayValue : Array<string>, selected : number})
 | itemSize                | Length                                   | 字母索引条字母区域大小，字母区域为正方形，设置正方形边长。       |
 | alignStyle              | IndexerAlign                             | 字母索引条对齐样式，支持左侧对齐样式与右侧对齐样式，影响弹窗弹出位置。 |
 
-- IndexerAlign枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Left | 弹框显示在索引条右侧。 | 
-  | Right | 弹框显示在索引条左侧。 | 
+## IndexerAlign枚举说明
 
+| 名称    | 描述          |
+| ----- | ----------- |
+| Left  | 弹框显示在索引条右侧。 |
+| Right | 弹框显示在索引条左侧。 |
 
 ## 事件
 
 | 名称                                       | 功能描述                                     |
-| -------- | -------- |
-| onSelected(index:&nbsp;number)&nbsp;=&gt;&nbsp;void<sup>(deprecated) </sup>| 索引条选中回调。 |
+| ---------------------------------------- | ---------------------------------------- |
+| onSelected(index:&nbsp;number)&nbsp;=&gt;&nbsp;void<sup>(deprecated) </sup> | 索引条选中回调。                                 |
 | onSelect(index:&nbsp;number)&nbsp;=&gt;&nbsp;void<sup>8+</sup> | 索引条选中回调。                                 |
 | onRequestPopupData(callback:&nbsp;(index:&nbsp;number)&nbsp;=&gt;&nbsp;Array&lt;string&gt;)<sup>8+</sup> | 选中字母索引后，请求索引提示窗口显示内容回调。<br/>返回值：索引对应的字符串数组，此字符串数组在弹出窗口中竖排显示，字符串列表最多显示5个，超出部分可以滑动显示。 |
 | onPopupSelect(callback:&nbsp;(index:&nbsp;number)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | 字母索引提示窗口选中回调。                            |
@@ -63,7 +61,8 @@ AlphabetIndexer(value: {arrayValue : Array&lt;string&gt;, selected : number})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct AlphabetIndexerSample {

zh-cn/application-dev/reference/arkui-ts/ts-container-badge.md

 # Badge
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -21,44 +22,48 @@
 
 Badge(value: {count: number, position?: BadgePosition, maxCount?: number, style?: BadgeStyle})
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | count | number | 是 | - | 设置提醒消息数。 |
-  | position | BadgePosition | 否 | BadgePosition.RightTop | 设置提示点显示位置。 |
-  | maxCount | number | 否 | 99 | 最大消息数，超过最大消息时仅显示maxCount+。 |
-  | style | BadgeStyle | 否 | - | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
+**参数：**
+
+| 参数名      | 参数类型          | 必填   | 默认值                    | 参数描述                              |
+| -------- | ------------- | ---- | ---------------------- | --------------------------------- |
+| count    | number        | 是    | -                      | 设置提醒消息数。                          |
+| position | BadgePosition | 否    | BadgePosition.RightTop | 设置提示点显示位置。                        |
+| maxCount | number        | 否    | 99                     | 最大消息数，超过最大消息时仅显示maxCount+。        |
+| style    | BadgeStyle    | 否    | -                      | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
 
 Badge(value: {value: string, position?: BadgePosition, style?: BadgeStyle})
 
 根据字符串创建提醒组件。
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | value | string | 是 | - | 提示内容的文本字符串。 |
-  | position | BadgePosition | 否 | BadgePosition.RightTop | 设置提示点显示位置。 |
-  | style | BadgeStyle | 否 | - | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
-
-- BadgeStyle对象说明
-  | 名称 | 类型 | 必填 | 默认值 | 描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | color | Color | 否 | Color.White | 文本颜色。 |
-  | fontSize | number \| string | 否 | 10 | 文本大小。 |
-  | badgeSize | number \| string | 是 | - | badge的大小。 |
-  | badgeColor | Color | 否 | Color.Red | badge的颜色。 |
-
-- BadgePosition枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Right | 圆点显示在右侧纵向居中。 | 
-  | RightTop | 圆点显示在右上角。 | 
-  | Left | 圆点显示在左侧纵向居中。 | 
+**参数：**
+
+| 参数名      | 参数类型          | 必填   | 默认值                    | 参数描述                              |
+| -------- | ------------- | ---- | ---------------------- | --------------------------------- |
+| value    | string        | 是    | -                      | 提示内容的文本字符串。                       |
+| position | BadgePosition | 否    | BadgePosition.RightTop | 设置提示点显示位置。                        |
+| style    | BadgeStyle    | 否    | -                      | Badge组件可设置样式，支持设置文本颜色、尺寸、圆点颜色和尺寸。 |
+
+## BadgeStyle对象说明
 
+| 名称         | 类型                         | 必填   | 默认值         | 描述        |
+| ---------- | -------------------------- | ---- | ----------- | --------- |
+| color      | Color                      | 否    | Color.White | 文本颜色。     |
+| fontSize   | number \| string | 否    | 10          | 文本大小。     |
+| badgeSize  | number \| string | 是    | -           | badge的大小。 |
+| badgeColor | Color                      | 否    | Color.Red   | badge的颜色。 |
+
+## BadgePosition枚举说明
+
+| 名称       | 描述           |
+| -------- | ------------ |
+| Right    | 圆点显示在右侧纵向居中。 |
+| RightTop | 圆点显示在右上角。    |
+| Left     | 圆点显示在左侧纵向居中。 |
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct BadgeExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-column.md

 # Column
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 沿垂直方向布局的容器。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -21,32 +21,32 @@
 
 Column(value:{space?: Length})
 
+**参数：**
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 
-  | -------- | -------- | -------- | -------- | -------- |
-  | space | Length | 否 | 0 | 纵向布局元素间距。 | 
-
+| 参数名   | 参数类型   | 必填   | 默认值  | 参数描述      |
+| ----- | ------ | ---- | ---- | --------- |
+| space | Length | 否    | 0    | 纵向布局元素间距。 |
 
 ## 属性
 
 | 名称               | 参数类型                              | 默认值                    | 描述                |
-| -------- | -------- | -------- | -------- |
+| ---------------- | --------------------------------- | ---------------------- | ----------------- |
 | alignItems       | HorizontalAlign                   | HorizontalAlign.Center | 设置子组件在水平方向上的对齐格式。 |
 | justifyContent8+ | [FlexAlign](ts-container-flex.md) | FlexAlign.Start        | 设置子组件在垂直方向上的对齐格式。 |
 
-- HorizontalAlign枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | Start | 按照语言方向起始端对齐。 | 
-  | Center | 居中对齐，默认对齐方式。 | 
-  | End | 按照语言方向末端对齐。 |
+## HorizontalAlign枚举说明
 
+| 名称     | 描述           |
+| ------ | ------------ |
+| Start  | 按照语言方向起始端对齐。 |
+| Center | 居中对齐，默认对齐方式。 |
+| End    | 按照语言方向末端对齐。  |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ColumnExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-columnsplit.md

 # ColumnSplit
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 将子组件纵向布局，并在每个子组件之间插入一根横向的分割线。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -25,16 +25,17 @@ ColumnSplit()
 ## 属性
 
 | 名称         | 参数类型    | 描述                 |
-| -------- | -------- | -------- |
+| ---------- | ------- | ------------------ |
 | resizeable | boolean | 分割线是否可拖拽，默认为false。 |
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 >  与RowSplit相同，ColumnSplit的分割线最小能拖动到刚好包含子组件。
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ColumnSplitExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md

 # Counter
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
+>
 >  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -27,14 +28,15 @@ Counter()
 不支持通用事件和手势， 仅支持如下事件：
 
 | 名称                                       | 功能描述      |
-| -------- | -------- |
+| ---------------------------------------- | --------- |
 | onInc(event: () => void) | 监听数值增加事件。 |
 | onDec(event: () => void) | 监听数值减少事件。 |
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct CounterExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-flex.md

 # Flex
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
-
 弹性布局组件。
 
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
+
 
 ## 权限列表
 
@@ -23,40 +23,43 @@ Flex(options?: { direction?: FlexDirection, wrap?: FlexWrap,  justifyContent?: F
 
 标准Flex布局容器。
 
-- 参数
-  | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | direction | FlexDirection                                       | 否 | FlexDirection.Row | 子组件在Flex容器上排列的方向，即主轴的方向。 |
-  | wrap | FlexWrap | 否 | FlexWrap.NoWrap | Flex容器是单行/列还是多行/列排列。 |
-  | justifyContent | FlexAlign | 否 | FlexAlign.Start | 子组件在Flex容器主轴上的对齐格式。 |
-  | alignItems | [ItemAlign](ts-appendix-enums.md#itemalign枚举说明) | 否 | ItemAlign.Stretch | 子组件在Flex容器交叉轴上的对齐格式。 |
-  | alignContent | FlexAlign | 否 | FlexAlign.Start | 交叉轴中有额外的空间时，多行内容的对齐方式。仅在wrap为Wrap或WrapReverse下生效。 |
-
-- FlexDirection枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Row | 主轴与行方向一致作为布局模式。 |
-  | RowReverse | 与Row方向相反方向进行布局。 |
-  | Column | 主轴与列方向一致作为布局模式。 |
-  | ColumnReverse | 与Column相反方向进行布局。 |
-
-- FlexWrap枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | NoWrap | Flex容器的元素单行/列布局，子项不允许超出容器。 |
-  | Wrap | Flex容器的元素多行/列排布，子项允许超出容器。 |
-  | WrapReverse | Flex容器的元素反向多行/列排布，子项允许超出容器。 |
-
-- FlexAlign枚举说明
-  | 名称 | 描述 |
-  | -------- | -------- |
-  | Start | 元素在主轴方向首端对齐, 第一个元素与行首对齐，同时后续的元素与前一个对齐。 |
-  | Center | 元素在主轴方向中心对齐，第一个元素与行首的距离与最后一个元素与行尾距离相同。 |
-  | End | 元素在主轴方向尾部对齐,  最后一个元素与行尾对齐，其他元素与后一个对齐。 |
-  | SpaceBetween | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素与行首对齐，最后一个元素与行尾对齐。 |
-  | SpaceAround | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。 |
-  | SpaceEvenly | Flex主轴方向元素等间距布局， 相邻元素之间的间距、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样。 |
-
+**参数：**
+
+| 参数名            | 参数类型                                     | 必填   | 默认值               | 参数描述                                     |
+| -------------- | ---------------------------------------- | ---- | ----------------- | ---------------------------------------- |
+| direction      | FlexDirection                            | 否    | FlexDirection.Row | 子组件在Flex容器上排列的方向，即主轴的方向。                 |
+| wrap           | FlexWrap                                 | 否    | FlexWrap.NoWrap   | Flex容器是单行/列还是多行/列排列。                     |
+| justifyContent | FlexAlign                                | 否    | FlexAlign.Start   | 子组件在Flex容器主轴上的对齐格式。                      |
+| alignItems     | [ItemAlign](ts-appendix-enums.md#itemalign枚举说明) | 否    | ItemAlign.Stretch | 子组件在Flex容器交叉轴上的对齐格式。                     |
+| alignContent   | FlexAlign                                | 否    | FlexAlign.Start   | 交叉轴中有额外的空间时，多行内容的对齐方式。仅在wrap为Wrap或WrapReverse下生效。 |
+
+## FlexDirection枚举说明
+
+| 名称            | 描述               |
+| ------------- | ---------------- |
+| Row           | 主轴与行方向一致作为布局模式。  |
+| RowReverse    | 与Row方向相反方向进行布局。  |
+| Column        | 主轴与列方向一致作为布局模式。  |
+| ColumnReverse | 与Column相反方向进行布局。 |
+
+## FlexWrap枚举说明
+
+| 名称          | 描述                          |
+| ----------- | --------------------------- |
+| NoWrap      | Flex容器的元素单行/列布局，子项不允许超出容器。  |
+| Wrap        | Flex容器的元素多行/列排布，子项允许超出容器。   |
+| WrapReverse | Flex容器的元素反向多行/列排布，子项允许超出容器。 |
+
+## FlexAlign枚举说明
+
+| 名称           | 描述                                       |
+| ------------ | ---------------------------------------- |
+| Start        | 元素在主轴方向首端对齐, 第一个元素与行首对齐，同时后续的元素与前一个对齐。 |
+| Center       | 元素在主轴方向中心对齐，第一个元素与行首的距离与最后一个元素与行尾距离相同。   |
+| End          | 元素在主轴方向尾部对齐,  最后一个元素与行尾对齐，其他元素与后一个对齐。 |
+| SpaceBetween | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素与行首对齐，最后一个元素与行尾对齐。 |
+| SpaceAround  | Flex主轴方向均匀分配弹性元素，相邻元素之间距离相同。 第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。 |
+| SpaceEvenly  | Flex主轴方向元素等间距布局， 相邻元素之间的间距、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样。 |
 
 ## 示例
 

zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md

 # Grid
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
-> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
-
 网格容器，由“行”和“列”分割的单元格所组成，通过指定“项目”所在的单元格做出各种各样的布局。
 
-
+>  **说明：**
+>
+>  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
 ## 权限列表
@@ -46,7 +45,8 @@ Grid()
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct GridExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-gridcontainer.md

 # GridContainer
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 >  该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -21,23 +21,24 @@
 
 GridContainer(options?: { columns?: number | 'auto', sizeType?: SizeType, gutter?: Length, margin?: Length})
 
-- 参数
-  | 参数名 | 类型 | 必填 | 默认值 | 说明 |
-  | -------- | -------- | -------- | -------- | -------- |
-  | columns | number \| 'auto' | 否 | 'auto' | 设置当前布局总列数。 |
-  | sizeType | SizeType | 否 | SizeType.Auto | 选用设备宽度类型。 |
-  | gutter | Length | 否 | - | 栅格布局列间距。 |
-  | margin | Length | 否 | - | 栅格布局两侧间距。 |
+**参数：**
 
-- SizeType枚举说明
-  | 名称 | 描述 | 
-  | -------- | -------- |
-  | XS | 最小宽度类型设备。 | 
-  | SM | 小宽度类型设备。 | 
-  | MD | 中等宽度类型设备。 | 
-  | LG | 大宽度类型设备。 | 
-  | Auto | 根据设备类型进行选择。 | 
+| 参数名      | 类型                         | 必填   | 默认值           | 说明         |
+| -------- | -------------------------- | ---- | ------------- | ---------- |
+| columns  | number \| 'auto' | 否    | 'auto'        | 设置当前布局总列数。 |
+| sizeType | SizeType                   | 否    | SizeType.Auto | 选用设备宽度类型。  |
+| gutter   | Length                     | 否    | -             | 栅格布局列间距。   |
+| margin   | Length                     | 否    | -             | 栅格布局两侧间距。  |
 
+## SizeType枚举说明
+
+| 名称   | 描述          |
+| ---- | ----------- |
+| XS   | 最小宽度类型设备。   |
+| SM   | 小宽度类型设备。    |
+| MD   | 中等宽度类型设备。   |
+| LG   | 大宽度类型设备。    |
+| Auto | 根据设备类型进行选择。 |
 
 ## 属性
 
@@ -51,7 +52,8 @@ GridContainer(options?: { columns?: number | 'auto', sizeType?: SizeType, gutter
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct GridContainerExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-griditem.md

 # GridItem
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -31,7 +31,7 @@ GridItem()
 | columnStart | number | - | 用于指定当前元素起始列号。 |
 | columnEnd | number | - | 用于指定当前元素终点列号。 |
 | forceRebuild | boolean | false | 用于设置在触发组件build时是否重新创建此节点。 |
-| selectable<sup>8+</sup> | boolean | true | 当前GridItem元素是否可以被鼠标框选。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;外层Grid容器的鼠标框选开启时，GridItem的框选才生效。 |
+| selectable<sup>8+</sup> | boolean | true | 当前GridItem元素是否可以被鼠标框选。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;外层Grid容器的鼠标框选开启时，GridItem的框选才生效。 |
 
 
 ## 事件
@@ -43,7 +43,8 @@ GridItem()
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct GridItemExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-list.md

 # List
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -54,7 +54,7 @@ List(value:{space?: number, initialIndex?: number})
 | onItemDelete(index: number) => boolean | 列表项删除时触发。 | 
 | onScrollIndex(firstIndex: number, lastIndex: number) => void | 当前列表显示的起始位置和终止位置发生变化时触发。 |
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > List使能可编辑模式需配合onItemDelete事件和ListItem的editable属性，即可编辑模式实现删除列表项功能，需满足以下条件：
 > 
 > - editMode属性设置为true。
@@ -72,7 +72,8 @@ List(value:{space?: number, initialIndex?: number})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ListExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md

 # ListItem
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -28,7 +28,7 @@ ListItem()
 | -------- | -------- | -------- | -------- |
 | sticky | Sticky | Sticky.None | 设置ListItem吸顶效果，参见Sticky枚举描述。 |
 | editable | boolean | false | 当前ListItem元素是否可编辑，进入编辑模式后可删除。 |
-| selectable<sup>8+</sup> | boolean | true | 当前ListItem元素是否可以被鼠标框选。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;外层List容器的鼠标框选开启时，ListItem的框选才生效。 |
+| selectable<sup>8+</sup> | boolean | true | 当前ListItem元素是否可以被鼠标框选。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;外层List容器的鼠标框选开启时，ListItem的框选才生效。 |
 
 - Sticky枚举说明
   | 名称 | 描述 | 
@@ -46,7 +46,8 @@ ListItem()
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ListItemExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-navigator.md

 # Navigator
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 

zh-cn/application-dev/reference/arkui-ts/ts-container-panel.md

 # Panel
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -62,7 +62,8 @@ Panel(value:{show：boolean})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct PanelExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-refresh.md

 # Refresh
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 下拉刷新容器。
@@ -48,7 +48,8 @@ Refresh\(value: \{refreshing: boolean, offset?: Length, friction?: number | stri
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RefreshExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-row.md

 # Row
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -44,7 +44,8 @@ Row(value:{space?: Length})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RowExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-rowsplit.md

 # RowSplit
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -28,13 +28,14 @@ RowSplit()
 | -------- | -------- | -------- |
 | resizeable | boolean | 分割线是否可拖拽，默认为false。 | 
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > RowSplit的分割线最小能拖动到刚好包含子组件。
 
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RowSplitExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md

 # Scroll
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -123,7 +123,7 @@ scroller.scrollToIndex(value: number): void
 滑动到指定Index。
 
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 仅支持list组件。
 
 
@@ -135,7 +135,8 @@ scroller.scrollToIndex(value: number): void
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ScrollExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-sidebarcontainer.md

 # SideBarContainer
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -64,7 +64,8 @@ SideBarContainer( type?: SideBarContainerType )
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct SideBarContainerExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-stack.md

 # Stack
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -29,7 +29,8 @@ Stack(value:{alignContent?: Alignment})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct StackExample {

zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md

 # TabContent
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -28,9 +28,9 @@ TabContent()
 
 | 名称     | 参数类型                                     | 默认值  | 描述                                       |
 | ------ | ---------------------------------------- | ---- | ---------------------------------------- |
-| tabBar | string&nbsp;\|&nbsp;{<br/>icon?:&nbsp;string,<br/>text?:&nbsp;string<br/>}<br/>\|&nbsp;[CustomBuilder](../../ui/ts-types.md)<sup>8+</sup> | -    | 设置TabBar上显示内容。<br/>CustomBuilder:&nbsp;构造器，内部可以传入组件（API8版本以上适用）。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;如果icon采用svg格式图源，则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源，icon大小则是svg本身内置的宽高属性值大小。 |
+| tabBar | string&nbsp;\|&nbsp;{<br/>icon?:&nbsp;string,<br/>text?:&nbsp;string<br/>}<br/>\|&nbsp;[CustomBuilder](../../ui/ts-types.md)<sup>8+</sup> | -    | 设置TabBar上显示内容。<br/>CustomBuilder:&nbsp;构造器，内部可以传入组件（API8版本以上适用）。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;如果icon采用svg格式图源，则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源，icon大小则是svg本身内置的宽高属性值大小。 |
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > - TabContent组件不支持设置通用宽度属性，其宽度默认撑满Tabs父组件。
 >
 > - TabContent组件不支持设置通用高度属性，其高度由Tabs父组件高度与TabBar组件高度决定。
@@ -38,7 +38,8 @@ TabContent()
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TabContentExample  {

zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md

 # Tabs
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -86,7 +86,8 @@ changeIndex(value: number): void
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TabsExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-circle.md

 # Circle
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -43,7 +43,8 @@ Circle(options?: {width: Length, height: Length})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct CircleExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-ellipse.md

 # Ellipse
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -43,7 +43,8 @@ ellipse(options?: {width: Length, height: Length})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct EllipseExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-line.md

 # Line
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -45,7 +45,8 @@ Line(options?: {width: Length, height: Length})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct LineExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-path.md

@@ -63,7 +63,8 @@ Path(value?: { width?: number | string, height?: number | string, commands?: str
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct PathExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polygon.md

 # Polygon
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -44,7 +44,8 @@ Polygon(value:{options?: {width: Length, height: Length}})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct PolygonExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polyline.md

 # Polyline
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -44,7 +44,8 @@ Polyline(options?: {width: Length, height: Length})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct PolylineExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-rect.md

 # Rect
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -49,7 +49,8 @@ Rect(value:{options?: {width: Length,height: Length,radius?: Length | Array<L
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct RectExample {

zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-shape.md

 # Shape
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -59,7 +59,8 @@ Shape(value:{target?: PixelMap})
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ShapeExample {

zh-cn/application-dev/reference/arkui-ts/ts-explicit-animation.md

 # 显式动画
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -30,7 +30,8 @@
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct AnimateToExample {

zh-cn/application-dev/reference/arkui-ts/ts-interpolation-calculation.md

 # 插值计算
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 

zh-cn/application-dev/reference/arkui-ts/ts-matrix-transformation.md

 # 矩阵变换
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 

zh-cn/application-dev/reference/arkui-ts/ts-media-components-video.md

 # Video
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 视频播放组件。
@@ -33,7 +33,7 @@ Video(value: VideoOptions)
   | 参数名                 | 参数类型                                     | 必填   | 默认值                                      | 参数描述                                     |
   | ------------------- | ---------------------------------------- | ---- | ---------------------------------------- | ---------------------------------------- |
   | src                 | string \| [Resource](../../ui/ts-types.md) | 否    | -                                        | 视频播放源的路径，支持本地视频路径和网络路径。<br>支持在resources下面的video或rawfile文件夹里放置媒体资源。<br>支持dataability://的路径前缀，用于访问通过Data Ability提供的视频路径，具体路径信息详见[Data Ability说明](../../ability/fa-dataability.md)。 |
-  | currentProgressRate | number&nbsp;\|&nbsp;PlaybackSpeed<sup>8+</sup> | 否    | 1.0&nbsp;\|&nbsp;PlaybackSpeed.<br>Speed_Forward_1_00_X | 视频播放倍速。<br/>>&nbsp;![icon-note.gif](public_sys-resources/icon-note.gif)&nbsp;**说明：**<br/>>&nbsp;number取值仅支持：0.75，1.0，1.25，1.75，2.0。<br/> |
+  | currentProgressRate | number&nbsp;\|&nbsp;PlaybackSpeed<sup>8+</sup> | 否    | 1.0&nbsp;\|&nbsp;PlaybackSpeed.<br>Speed_Forward_1_00_X | 视频播放倍速。<br/>>&nbsp;&nbsp;**说明：**<br/>>&nbsp;number取值仅支持：0.75，1.0，1.25，1.75，2.0。<br/> |
   | previewUri          | string&nbsp;\|&nbsp;PixelMap<sup>8+</sup>&nbsp;\|&nbsp;[Resource](../../ui/ts-types.md) | 否    | -                                        | 预览图片的路径。                                 |
   | controller          | [VideoController](#videocontroller)      | 否    | -                                        | 控制器。                                     |
 
@@ -155,7 +155,8 @@ setCurrentTime(value: number, seekMode: SeekMode)
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct VideoCreateComponent {

zh-cn/application-dev/reference/arkui-ts/ts-methods-action-sheet.md

 # 列表选择弹窗
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -42,7 +42,8 @@ show(options: { paramObject1})
 ## 示例
 
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct ActionSheetExapmle {

zh-cn/application-dev/reference/arkui-ts/ts-methods-alert-dialog-box.md

 # 警告弹窗
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 
@@ -41,7 +41,8 @@
 
 ## 示例
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct AlertDialogExample {

zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md

 # 自定义弹窗
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 

zh-cn/application-dev/reference/arkui-ts/ts-methods-menu.md

 # 菜单
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从 API Version 8 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
 
 ## ContextMenu.close

zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md

 # 页面间转场
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **说明：**
+>  **说明：**
 > 从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。