!774 format modification

Merge pull request !774 from zengyawen/master

zh-cn/application-dev/Readme-CN.md

+# 应用开发
+
+- [应用开发导读](application-dev-guide.md)
+- DevEco Studio（OpenHarmony）使用指南
+    - [概述](quick-start/deveco-studio-overview.md)
+    - [版本变更说明](quick-start/deveco-studio-release-notes.md)
+    - [配置OpenHarmony SDK](quick-start/configuring-openharmony-sdk.md)
+    - 创建OpenHarmony工程
+        - [使用工程向导创建新工程](quick-start/use-wizard-to-create-project.md)
+        - [通过导入Sample方式创建新工程](quick-start/import-sample-to-create-project.md)
+    - [配置OpenHarmony应用签名信息](quick-start/configuring-openharmony-app-signature.md)
+    - [安装运行OpenHarmony应用](quick-start/installing-openharmony-app.md)
+- [包结构说明](quick-start/package-structure.md)
+- 快速入门
+    - [开发准备](quick-start/start-overview.md)
+    - [使用JS语言开发](quick-start/start-with-js.md)
+- JS UI框架
+    - [JS UI框架概述](ui/ui-js-overview.md)
+    - 构建用户界面
+        - [组件介绍](ui/ui-js-building-ui-component.md)
+        - 构建布局
+            - [布局说明](ui/ui-js-building-ui-layout-intro.md)
+            - [添加标题行和文本区域](ui/ui-js-building-ui-layout-text.md)
+            - [添加图片区域](ui/ui-js-building-ui-layout-image.md)
+            - [添加留言区域](ui/ui-js-building-ui-layout-comment.md)
+            - [添加容器](ui/ui-js-building-ui-layout-external-container.md)
+        - [添加交互](ui/ui-js-building-ui-interactions.md)
+        - [动画](ui/ui-js-building-ui-animation.md)
+        - [事件](ui/ui-js-building-ui-event.md)
+        - [页面路由](ui/ui-js-building-ui-routes.md)
+    - [自定义组件](ui/ui-js-custom-components.md)
+- 音频
+    - [音频开发概述](media/audio-overview.md)
+    - [音频播放开发指导](media/audio-playback.md)
+    - [音频管理开发指导](media/audio-management.md)
+    - [音频录制开发指导](media/audio-recorder.md)
+- IPC与RPC通信
+    - [IPC与RPC通信概述](connectivity/ipc-rpc-overview.md)
+    - [IPC与RPC通信开发指导](connectivity/ipc-rpc-development-guideline.md)
+    - [远端状态订阅开发实例](connectivity/subscribe-remote-state.md)
+- JS 开发参考
+    - 框架说明
+        - [文件组织](js-reference/js-framework-file.md)
+        - [js标签配置](js-reference/js-framework-js-tag.md)
+        - [app.js](js-reference/js-framework-js-file.md)
+        - 语法
+            - [HML语法参考](js-reference/js-framework-syntax-hml.md)
+            - [CSS语法参考](js-reference/js-framework-syntax-css.md)
+            - [JS语法参考](js-reference/js-framework-syntax-js.md)
+        - [生命周期](js-reference/js-framework-lifecycle.md)
+        - [资源限定与访问](js-reference/js-framework-resource-restriction.md)
+        - [多语言支持](js-reference/js-framework-multiple-languages.md)
+    - 组件
+        - 通用
+            - [通用属性](js-reference/component/js-components-common-attributes.md)
+            - [通用样式](js-reference/component/js-components-common-styles.md)
+            - [通用事件](js-reference/component/js-components-common-events.md)
+            - [通用方法](js-reference/component/js-components-common-methods.md)
+            - [动画样式](js-reference/component/js-components-common-animation.md)
+            - [渐变样式](js-reference/component/js-components-common-gradient.md)
+            - [转场样式](js-reference/component/js-components-common-transition.md)
+            - [媒体查询](js-reference/component/js-components-common-mediaquery.md)
+            - [自定义字体样式](js-reference/component/js-components-common-customizing-font.md)
+            - [原子布局](js-reference/component/js-components-common-atomic-layout.md)
+        - 容器组件
+            - [badge](js-reference/component/js-components-container-badge.md)
+            - [dialog](js-reference/component/js-components-container-dialog.md)
+            - [div](js-reference/component/js-components-container-div.md)
+            - [form](js-reference/component/js-components-container-form.md)
+            - [list](js-reference/component/js-components-container-list.md)
+            - [list-item](js-reference/component/js-components-container-list-item.md)
+            - [list-item-group](js-reference/component/js-components-container-list-item-group.md)
+            - [panel](js-reference/component/js-components-container-panel.md)
+            - [popup](js-reference/component/js-components-container-popup.md)
+            - [refresh](js-reference/component/js-components-container-refresh.md)
+            - [stack](js-reference/component/js-components-container-stack.md)
+            - [stepper](js-reference/component/js-components-container-stepper.md)
+            - [stepper-item](js-reference/component/js-components-container-stepper-item.md)
+            - [swiper](js-reference/component/js-components-container-swiper.md)
+            - [tabs](js-reference/component/js-components-container-tabs.md)
+            - [tab-bar](js-reference/component/js-components-container-tab-bar.md)
+            - [tab-content](js-reference/component/js-components-container-tab-content.md)
+        - 基础组件
+            - [button](js-reference/component/js-components-basic-button.md)
+            - [chart](js-reference/component/js-components-basic-chart.md)
+            - [divider](js-reference/component/js-components-basic-divider.md)
+            - [image](js-reference/component/js-components-basic-image.md)
+            - [image-animator](js-reference/component/js-components-basic-image-animator.md)
+            - [input](js-reference/component/js-components-basic-input.md)
+            - [label](js-reference/component/js-components-basic-label.md)
+            - [marquee](js-reference/component/js-components-basic-marquee.md)
+            - [menu](js-reference/component/js-components-basic-menu.md)
+            - [option](js-reference/component/js-components-basic-option.md)
+            - [picker](js-reference/component/js-components-basic-picker.md)
+            - [picker-view](js-reference/component/js-components-basic-picker-view.md)
+            - [piece](js-reference/component/js-components-basic-piece.md)
+            - [progress](js-reference/component/js-components-basic-progress.md)
+            - [qrcode](js-reference/component/js-components-basic-qrcode.md)
+            - [rating](js-reference/component/js-components-basic-rating.md)
+            - [richtext](js-reference/component/js-components-basic-richtext.md)
+            - [search](js-reference/component/js-components-basic-search.md)
+            - [select](js-reference/component/js-components-basic-select.md)
+            - [slider](js-reference/component/js-components-basic-slider.md)
+            - [span](js-reference/component/js-components-basic-span.md)
+            - [switch](js-reference/component/js-components-basic-switch.md)
+            - [text](js-reference/component/js-components-basic-text.md)
+            - [textarea](js-reference/component/js-components-basic-textarea.md)
+            - [toolbar](js-reference/component/js-components-basic-toolbar.md)
+            - [toolbar-item](js-reference/component/js-components-basic-toolbar-item.md)
+            - [toggle](js-reference/component/js-components-basic-toggle.md)
+        - 媒体组件
+            - [video](js-reference/component/js-components-media-video.md)
+        - 画布组件
+            - [canvas组件](js-reference/component/js-components-canvas-canvas.md)
+            - [CanvasRenderingContext2D对象](js-reference/component/js-components-canvas-canvasrenderingcontext2d.md)
+            - [Image对象](js-reference/component/js-components-canvas-image.md)
+            - [CanvasGradient对象](js-reference/component/js-components-canvas-canvasgradient.md)
+            - [ImageData对象](js-reference/component/js-components-canvas-imagedata.md)
+            - [Path2D对象](js-reference/component/js-components-canvas-path2d.md)
+            - [ImageBitmap对象](js-reference/component/js-components-canvas-imagebitmap.md)
+            - [OffscreenCanvas对象](js-reference/component/js-components-canvas-offscreencanvas.md)
+            - [OffscreenCanvasRenderingContext2D对象](js-reference/component/js-components-canvas-offscreencanvasrenderingcontext2d.md)
+        - 栅格组件
+            - [基本概念](js-reference/component/js-components-grid-basic-concepts.md)
+            - [grid-container](js-reference/component/js-components-grid-container.md)
+            - [grid-row](js-reference/component/js-components-grid-row.md)
+            - [grid-col](js-reference/component/js-components-grid-col.md)
+        - svg组件
+            - [通用属性](js-reference/component/js-components-svg-common-attributes.md)
+            - [svg](js-reference/component/js-components-svg.md)
+            - [rect](js-reference/component/js-components-svg-rect.md)
+            - [circle](js-reference/component/js-components-svg-circle.md)
+            - [ellipse](js-reference/component/js-components-svg-ellipse.md)
+            - [path](js-reference/component/js-components-svg-path.md)
+            - [line](js-reference/component/js-components-svg-line.md)
+            - [polyline](js-reference/component/js-components-svg-polyline.md)
+            - [polygon](js-reference/component/js-components-svg-polygon.md)
+            - [text](js-reference/component/js-components-svg-text.md)
+            - [tspan](js-reference/component/js-components-svg-tspan.md)
+            - [textPath](js-reference/component/js-components-svg-textpath.md)
+            - [animate](js-reference/component/js-components-svg-animate.md)
+            - [animateMotion](js-reference/component/js-components-svg-animate-motion.md)
+            - [animateTransform](js-reference/component/js-components-svg-animate-transform.md)
+    - 自定义组件
+        - [基本用法](js-reference/component/js-components-custom-basic-usage.md)
+        - [自定义事件](js-reference/component/js-components-custom-events.md)
+        - [Props](js-reference/component/js-components-custom-props.md)
+        - [事件参数](js-reference/component/js-components-custom-event-parameter.md)
+        - [slot插槽](js-reference/component/js-components-custom-slot.md)
+        - [生命周期定义](js-reference/component/js-components-custom-lifecycle.md)
+    - 接口
+        - 基本功能
+            - [应用上下文](js-reference/apis/js-apis-system-app.md)
+            - [日志打印](js-reference/apis/js-apis-basic-features-logs.md)
+            - [页面路由](js-reference/apis/js-apis-system-router.md)
+            - [弹窗](js-reference/apis/js-apis-system-prompt.md)
+            - [应用配置](js-reference/apis/js-apis-system-configuration.md)
+            - [定时器](js-reference/apis/js-apis-system-timer.md)
+            - [动画](js-reference/apis/js-apis-animator.md)
+            - [应用打点](js-reference/apis/js-apis-hiappevent.md)
+            - [性能打点](js-reference/apis/js-apis-bytrace.md)
+            - [分布式帐号管理](js-reference/apis/js-apis-distributedaccount.md)
+        - 媒体
+            - [音频管理](js-reference/apis/js-apis-audio.md)
+            - [音频播放](js-reference/apis/js-apis-media.md)
+        - 数据管理
+            - [文件管理](js-reference/apis/js-apis-fileio.md)
+            - [单版本分布式数据库](js-reference/apis/js-apis-data-singlekvstore.md)
+            - [创建和获取分布式数据库](js-reference/apis/js-apis-data-kvmanager.md)
+            - [KVManager配置信息](js-reference/apis/js-apis-data-kvmanager-config.md)
+            - [分布式数据库操作描述](js-reference/apis/js-apis-data-kvstore.md)
+            - [数据类型描述](js-reference/apis/js-apis-data-type.md)
+            - [轻量级存储](js-reference/apis/js-apis-data-storage.md)
+        - 设备管理
+            - [设备信息](js-reference/apis/js-apis-deviceinfo.md)
+            - [系统属性](js-reference/apis/js-apis-systemparameter.md)
+            - [系统恢复](js-reference/apis/js-apis-update.md)
+            - [显示设备属性](js-reference/apis/js-apis-display.md)
+            - [电池和充电属性](js-reference/apis/js-apis-batteryinfo.md)
+            - [设置系统屏幕亮度](js-reference/apis/js-apis-brightness.md)
+            - [系统电源管理](js-reference/apis/js-apis-power.md)
+            - [Runninglock锁](js-reference/apis/js-apis-runninglock.md)
+            - [传感器](js-reference/apis/js-apis-sensor.md)
+            - [振动](js-reference/apis/js-apis-vibrate.md)
+            - [国际化（I18n）](js-reference/apis/js-apis-i18n.md)
+            - [国际化（Intl）](js-reference/apis/js-apis-intl.md)
+            - [资源管理](js-reference/apis/js-apis-resourcemanage.md)
+            - [时间设置](js-reference/apis/js-apis-systemtime.md)
+            - [升级](js-reference/apis/js-apis-libupdateclient.md)
+            - [获取进程相关的信息](js-reference/apis/js-apis-process.md)
+            - [字符串编解码](js-reference/apis/js-apis-util.md)
+            - [启动一个worker](js-reference/apis/js-apis-worker.md)
+            - [URL字符串解析](js-reference/apis/js-apis-url.md)

zh-cn/application-dev/application-dev-guide.md

-# 应用开发导读<a name="ZH-CN_TOPIC_0000001162242674"></a>
+# 应用开发导读
 
 应用开发文档用于指导开发者通过OpenHarmony提供的接口完成应用开发。当前应用开发文档提供了在标准系统上开发应用的JS接口。
 
-在这部分中，开发者可以通过“[入门](https://gitee.com/openharmony/docs/blob/5b6b26c33680dd1162a4df35c896e5ddefcb55b3/zh-cn/application-dev/quick-start/Readme-CN.md)”来了解应用开发的基本方法。完整的接口清单和参考使用指导可参见“[JS开发参考](https://gitee.com/openharmony/docs/blob/5b6b26c33680dd1162a4df35c896e5ddefcb55b3/zh-cn/application-dev/js-reference/Readme-CN.md)”。
+在这部分中，开发者可以通过“[入门](quick-start/Readme-CN.md)”来了解应用开发的基本方法。完整的接口清单和参考使用指导可参见“[JS开发参考](js-reference/Readme-CN.md)”。
 
-除此之外，为方便开发者对常用功能进行深入理解，还提供了[UI](https://gitee.com/openharmony/docs/blob/5b6b26c33680dd1162a4df35c896e5ddefcb55b3/zh-cn/application-dev/ui/Readme-CN.md)、[媒体](https://gitee.com/openharmony/docs/blob/5b6b26c33680dd1162a4df35c896e5ddefcb55b3/zh-cn/application-dev/media/Readme-CN.md)、[网络与连接](https://gitee.com/openharmony/docs/blob/5b6b26c33680dd1162a4df35c896e5ddefcb55b3/zh-cn/application-dev/connectivity/Readme-CN.md)三个模块的开发指南。
+除此之外，为方便开发者对常用功能进行深入理解，还提供了[UI](ui/Readme-CN.md)、[媒体](media/Readme-CN.md)、[网络与连接](connectivity/Readme-CN.md)三个模块的开发指南。
 
 如果需要了解各子系统的原理和基本信息，可以参考“docs/zh-cn/readme”目录中各子系统readme的介绍。
 

zh-cn/application-dev/connectivity/Readme-CN.md

 # 网络与连接
 
--   [IPC与RPC通信](ipc-rpc.md)
+- IPC与RPC通信
     - [IPC与RPC通信概述](ipc-rpc-overview.md)
     - [IPC与RPC通信开发指导](ipc-rpc-development-guideline.md)
     - [远端状态订阅开发实例](subscribe-remote-state.md)
-

zh-cn/application-dev/connectivity/ipc-rpc-development-guideline.md

-# IPC与RPC通信开发指导<a name="ZH-CN_TOPIC_0000001103710988"></a>
+# IPC与RPC通信开发指导
 
--   [场景介绍](#section18502174174019)
--   [接口说明](#section1633115419401)
--   [开发步骤](#section4207112818418)
+- [场景介绍](#场景介绍)
+- [接口说明](#接口说明)
+- [开发步骤](#开发步骤)
 
-## 场景介绍<a name="section18502174174019"></a>
+## 场景介绍
 
 IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，包括Proxy和Stub运行在不同设备的情况。
 
-## 接口说明<a name="section1633115419401"></a>
-
-**表 1**  Native侧IPC接口
-
-<a name="table178849240013"></a>
-<table><thead align="left"><tr id="row6884924608"><th class="cellrowborder" valign="top" width="14.12141214121412%" id="mcps1.2.4.1.1"><p id="p98846241706"><a name="p98846241706"></a><a name="p98846241706"></a>类/接口</p>
-</th>
-<th class="cellrowborder" valign="top" width="52.54525452545254%" id="mcps1.2.4.1.2"><p id="p1488482414020"><a name="p1488482414020"></a><a name="p1488482414020"></a>方法</p>
-</th>
-<th class="cellrowborder" valign="top" width="33.33333333333333%" id="mcps1.2.4.1.3"><p id="p388516244016"><a name="p388516244016"></a><a name="p388516244016"></a>功能说明</p>
-</th>
-</tr>
-</thead>
-<tbody><tr id="row15885824402"><td class="cellrowborder" valign="top" width="14.12141214121412%" headers="mcps1.2.4.1.1 "><p id="p08859241008"><a name="p08859241008"></a><a name="p08859241008"></a>IRemoteBroker</p>
-</td>
-<td class="cellrowborder" valign="top" width="52.54525452545254%" headers="mcps1.2.4.1.2 "><p id="p388572412010"><a name="p388572412010"></a><a name="p388572412010"></a>sptr&lt;IRemoteObject&gt; AsObject()</p>
-</td>
-<td class="cellrowborder" valign="top" width="33.33333333333333%" headers="mcps1.2.4.1.3 "><p id="p13885724405"><a name="p13885724405"></a><a name="p13885724405"></a>返回通信对象。派生类需要实现，Stub端返回RemoteObject对象本身，Proxy端返回代理对象。</p>
-</td>
-</tr>
-<tr id="row138859241808"><td class="cellrowborder" valign="top" width="14.12141214121412%" headers="mcps1.2.4.1.1 "><p id="p1888515245012"><a name="p1888515245012"></a><a name="p1888515245012"></a>IRemoteStub</p>
-</td>
-<td class="cellrowborder" valign="top" width="52.54525452545254%" headers="mcps1.2.4.1.2 "><p id="p1388516240011"><a name="p1388516240011"></a><a name="p1388516240011"></a>virtual int OnRemoteRequest(uint32_t code, MessageParcel &amp;data, MessageParcel &amp;reply, MessageOption &amp;option)</p>
-</td>
-<td class="cellrowborder" valign="top" width="33.33333333333333%" headers="mcps1.2.4.1.3 "><p id="p1188582414016"><a name="p1188582414016"></a><a name="p1188582414016"></a>请求处理方法，派生类需要重写，处理Proxy的请求并返回结果。</p>
-</td>
-</tr>
-<tr id="row108856241904"><td class="cellrowborder" valign="top" width="14.12141214121412%" headers="mcps1.2.4.1.1 "><p id="p6885924609"><a name="p6885924609"></a><a name="p6885924609"></a>IRemoteProxy</p>
-</td>
-<td class="cellrowborder" valign="top" width="52.54525452545254%" headers="mcps1.2.4.1.2 ">&nbsp;&nbsp;</td>
-<td class="cellrowborder" valign="top" width="33.33333333333333%" headers="mcps1.2.4.1.3 "><p id="p688592413018"><a name="p688592413018"></a><a name="p688592413018"></a>业务Proxy类派生自IRemoteProxy类。</p>
-</td>
-</tr>
-</tbody>
-</table>
-
-## 开发步骤<a name="section4207112818418"></a>
+
+## 接口说明
+
+**表1** Native侧IPC接口
+
+| 类/接口 | 方法 | 功能说明 | 
+| -------- | -------- | -------- |
+| IRemoteBroker | sptr&lt;IRemoteObject&gt;&nbsp;AsObject() | 返回通信对象。派生类需要实现，Stub端返回RemoteObject对象本身，Proxy端返回代理对象。 | 
+| IRemoteStub | virtual&nbsp;int&nbsp;OnRemoteRequest(uint32_t&nbsp;code,&nbsp;MessageParcel&nbsp;&amp;data,&nbsp;MessageParcel&nbsp;&amp;reply,&nbsp;MessageOption&nbsp;&amp;option) | 请求处理方法，派生类需要重写，处理Proxy的请求并返回结果。 | 
+| IRemoteProxy |  | 业务Proxy类派生自IRemoteProxy类。 | 
+
+
+## 开发步骤
 
 **Native侧开发步骤**
 
 1. 定义IPC接口ITestAbility
-
    SA接口继承IPC基类接口IRemoteBroker，接口里定义描述符、业务函数和消息码，其中业务函数在Proxy端和Stub端都需要实现。
 
    ```
    class ITestAbility : public IRemoteBroker {
    public:
-    // DECLARE_INTERFACE_DESCRIPTOR是必须的， 入参需使用std::u16string；
+   // DECLARE_INTERFACE_DESCRIPTOR是必须的，入参需使用std::u16string；
    DECLARE_INTERFACE_DESCRIPTOR(u"test.ITestAbility");
    int TRANS_ID_PING_ABILITY = 1; // 定义消息码
    virtual int TestPingAbility(const std::u16string &dummy) = 0; // 定义业务函数
@@ -63,8 +38,7 @@ IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，
    ```
 
 2. 定义和实现服务端TestAbilityStub
-
-    该类是和IPC框架相关的实现，需要继承 IRemoteStub<ITestAbility\>。Stub端作为接收请求的一端，需重写OnRemoteRequest方法用于接收客户端调用。
+   该类是和IPC框架相关的实现，需要继承 IRemoteStub&lt;ITestAbility&gt;。Stub端作为接收请求的一端，需重写OnRemoteRequest方法用于接收客户端调用。
 
    ```
    class TestAbilityStub : public IRemoteStub<ITestAbility> {
@@ -90,7 +64,6 @@ IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，
    ```
 
 3. 定义服务端业务函数具体实现类TestAbility
-
    ```
    class TestAbility : public TestAbilityStub {
    public:
@@ -102,9 +75,8 @@ IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，
    }
    ```
 
-4.  定义和实现客户端TestAbilityProxy
-
-    该类是Proxy端实现，继承IRemoteProxy<ITestAbility\>，调用SendRequest接口向Stub端发送请求，对外暴露服务端提供的能力。
+4. 定义和实现客户端 TestAbilityProxy
+   该类是Proxy端实现，继承IRemoteProxy&lt;ITestAbility&gt;，调用SendRequest接口向Stub端发送请求，对外暴露服务端提供的能力。
 
    ```
    class TestAbilityProxy : public IRemoteProxy<ITestAbility> {
@@ -120,7 +92,7 @@ IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，
    {
    }
    
-    int TestAbilityProxy::TestPingService(const std::u16string &dummy) {
+   int TestAbilityProxy::TestPingService(const std::u16string &dummy){
        MessageOption option;
        MessageParcel dataParcel, replyParcel;
        dataParcel.WriteString16(dummy);
@@ -130,9 +102,8 @@ IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，
     }
    ```
 
-5.  SA注册与启动
-
-    SA需要将自己的TestAbilityStub实例通过AddSystemAbility接口注册到SystemAbilityManager，设备内与分布式的注册参数不同。
+5. SA 注册与启动
+   SA 需要将自己的 TestAbilityStub实例通过 AddSystemAbility接口注册到 SystemAbilityManager，设备内与分布式的注册参数不同。
 
    ```
    // 注册到本设备内
@@ -146,8 +117,7 @@ IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，
    int result = samgr->AddSystemAbility(said, new TestAbility(), saExtra);
    ```
 
-6.  SA获取与调用
-
+6. SA 获取与调用
    通过SystemAbilityManager的GetSystemAbility方法可获取到对应SA的代理IRemoteObject，然后构造TestAbilityProxy即可。
 
    ```
@@ -161,5 +131,3 @@ IPC/RPC的主要工作是让运行在不同进程的Proxy和Stub互相通信，
    sptr<IRemoteObject> remoteObject = samgr->GetSystemAbility(sdid, deviceId); // deviceId是指定设备的标识符
    sptr<TestAbilityProxy> proxy(new TestAbilityProxy(remoteObject)); // 直接构造具体Proxy
    ```
-
-

zh-cn/application-dev/connectivity/ipc-rpc-overview.md

-# IPC与RPC通信概述<a name="ZH-CN_TOPIC_0000001103870800"></a>
+# IPC与RPC通信概述
 
--   [基本概念](#section175012297491)
--   [约束与限制](#section2029921310472)
--   [相关模块](#section1189019299446)
+- [基本概念](#基本概念)
+- [约束与限制](#约束与限制)
+- [相关模块](#相关模块)
 
-## 基本概念<a name="section175012297491"></a>
+## 基本概念
 
 IPC（Inter-Process Communication）与RPC（Remote Procedure Call）机制用于实现跨进程通信，不同的是前者使用Binder驱动，用于设备内的跨进程通信，而后者使用软总线驱动，用于跨设备跨进程通信。IPC和RPC通常采用客户端-服务器（Client-Server）模型，服务请求方（Client）可获取提供服务提供方（Server）的代理 （Proxy），并通过此代理读写数据来实现进程间的数据通信。通常，Server会先注册系统能力（System Ability）到系统能力管理者（System Ability Manager，缩写SAMgr）中，SAMgr负责管理这些SA并向Client提供相关的接口。Client要和某个具体的SA通信，必须先从SAMgr中获取该SA的代理，然后使用代理和SA通信。下文使用Proxy表示服务请求方，Stub表示服务提供方。
 
-## 约束与限制<a name="section2029921310472"></a>
+
+## 约束与限制
 
 目前暂不支持的场景：
 
 跨设备RPC
 
-## 相关模块<a name="section1189019299446"></a>
 
-分布式任务调度子系统
+## 相关模块
 
+分布式任务调度子系统

zh-cn/application-dev/connectivity/ipc-rpc.md

-# IPC与RPC通信<a name="ZH-CN_TOPIC_0000001157385969"></a>
+# IPC与RPC通信
+
 
 - **[IPC与RPC通信概述](ipc-rpc-overview.md)**
 
 - **[IPC与RPC通信开发指导](ipc-rpc-development-guideline.md)**
 
 - **[远端状态订阅开发实例](subscribe-remote-state.md)**
\ No newline at end of file
-
-

zh-cn/application-dev/connectivity/subscribe-remote-state.md

-# 远端状态订阅开发实例<a name="ZH-CN_TOPIC_0000001104030756"></a>
+# 远端状态订阅开发实例
+
+IPC/RPC 提供对远端 Stub对象状态的订阅机制， 在远端 Stub对象死亡时，可触发死亡通知告诉本地 Proxy对象。这种状态通知订阅并不会自动附加在每个本地 Proxy对象上，需要调用特定接口完成，当不再需要订阅时也需要调用特定接口取消。使用这种订阅机制的用户，需要实现死亡通知接口DeathRecipient并实现onRemoteDied方法，清理资源，该方法会在 远端 Stub对象所在进程死亡，或所在设备离开组网时被回调。值得注意的是，调用这些接口有一定的顺序。首先，必然需要 Proxy订阅 Stub死亡通知，若在订阅期间未发生 Stub死亡，则可在不再需要时取消订阅；若在订阅期间发生 Stub死亡，则会自动触发 Proxy自定义的后续操作，也无需再手动取消订阅。
+
+
+RPC目前不提供匿名 Stub对象的死亡通知，即只有向 SAMgr注册过的服务才能被订阅死亡通知。 IPC则支持匿名对象的死亡通知。
 
-IPC/RPC提供对远端Stub对象状态的订阅机制， 在远端Stub对象死亡时，可触发死亡通知告诉本地Proxy对象。这种状态通知订阅并不会自动附加在每个本地Proxy对象上，需要调用特定接口完成，当不再需要订阅时也需要调用特定接口取消。使用这种订阅机制的用户，需要实现死亡通知接口DeathRecipient并实现onRemoteDied方法，清理资源，该方法会在远端Stub对象所在进程死亡，或所在设备离开组网时被回调。值得注意的是，调用这些接口有一定的顺序。首先，必然需要Proxy订阅Stub死亡通知，若在订阅期间未发生Stub死亡，则可在不再需要时取消订阅；若在订阅期间发生Stub死亡，则会自动触发Proxy自定义的后续操作，也无需再手动取消订阅。
 
-RPC目前不提供匿名Stub对象的死亡通知，即只有向SAMgr注册过的服务才能被订阅死亡通知。IPC则支持匿名对象的死亡通知。
 
 **Native侧接口**
 
+
 依次为添加对远端Stub对象状态订阅的接口，取消订阅的接口，及感知到远端Stub对象死亡而进行本地操作的接口：
 
+
 ```
 bool AddDeathRecipient(const sptr<DeathRecipient> &recipient);
 bool RemoveDeathRecipient(const sptr<DeathRecipient> &recipient);
 void OnRemoteDied(const wptr<IRemoteObject> &object);
 ```
 
+
 参考代码
 
+
 ```
 class TestDeathRecipient : public IRemoteObject::DeathRecipient {
 public:
     virtual void OnRemoteDied(const wptr<IRemoteObject>& remoteObject);
 }
-sptr<IRemoteObject::DeathRecipient> deathRecipient (new TestDeathRecipient()); // 构造一个死亡通知对象
+sptr<IRemoteObject::DeathRecipient> deathRecipient (new TestDeathRecipient());// 构造一个死亡通知对象
 bool result = proxy->AddDeathRecipient(deathRecipient); // 注册死亡通知
 result = proxy->RemoveDeathRecipient(deathRecipient); // 移除死亡通知
 ```
-

zh-cn/application-dev/js-reference/Readme-CN.md

 # JS开发参考
 
--   [框架说明](js-framework.md)
+-   框架说明
     -   [文件组织](js-framework-file.md)
     -   [js标签配置](js-framework-js-tag.md)
     -   [app.js](js-framework-js-file.md)
-    -   [语法](js-framework-syntax.md)
+    -   语法
         -   [HML语法参考](js-framework-syntax-hml.md)
         -   [CSS语法参考](js-framework-syntax-css.md)
         -   [JS语法参考](js-framework-syntax-js.md)
@@ -14,7 +14,7 @@
     -   [多语言支持](js-framework-multiple-languages.md)
 
 -   [组件](component/Readme-CN.md)
-    -   [通用](component/js-components-common.md)
+    -   通用
         -   [通用属性](component/js-components-common-attributes.md)
         -   [通用样式](component/js-components-common-styles.md)
         -   [通用事件](component/js-components-common-events.md)
@@ -26,7 +26,7 @@
         -   [自定义字体样式](component/js-components-common-customizing-font.md)
         -   [原子布局](component/js-components-common-atomic-layout.md)
 
-    -   [容器组件](component/js-components-container.md)
+    -   容器组件
         -   [badge](component/js-components-container-badge.md)
         -   [dialog](component/js-components-container-dialog.md)
         -   [div](component/js-components-container-div.md)
@@ -45,7 +45,7 @@
         -   [tab-bar](component/js-components-container-tab-bar.md)
         -   [tab-content](component/js-components-container-tab-content.md)
 
-    -   [基础组件](component/js-components-basic.md)
+    -   基础组件
         -   [button](component/js-components-basic-button.md)
         -   [chart](component/js-components-basic-chart.md)
         -   [divider](component/js-components-basic-divider.md)
@@ -74,10 +74,10 @@
         -   [toolbar-item](component/js-components-basic-toolbar-item.md)
         -   [toggle](component/js-components-basic-toggle.md)
 
-    -   [媒体组件](component/js-components-media.md)
+    -   媒体组件
         -   [video](component/js-components-media-video.md)
 
-    -   [画布组件](component/js-components-canvas.md)
+    -   画布组件
         -   [canvas组件](component/js-components-canvas-canvas.md)
         -   [CanvasRenderingContext2D对象](component/js-components-canvas-canvasrenderingcontext2d.md)
         -   [Image对象](component/js-components-canvas-image.md)
@@ -88,15 +88,15 @@
         -   [OffscreenCanvas对象](component/js-components-canvas-offscreencanvas.md)
         -   [OffscreenCanvasRenderingContext2D对象](component/js-components-canvas-offscreencanvasrenderingcontext2d.md)
 
-    -   [栅格组件](component/js-components-grid.md)
+    -   栅格组件
         -   [基本概念](component/js-components-grid-basic-concepts.md)
         -   [grid-container](component/js-components-grid-container.md)
         -   [grid-row](component/js-components-grid-row.md)
         -   [grid-col](component/js-components-grid-col.md)
 
-    -   [svg组件](component/js-components-svg.md)
+    -   svg组件
         -   [通用属性](component/js-components-svg-common-attributes.md)
-        -   [svg](component/js-components-svg-0.md)
+        -   [svg](component/js-components-svg.md)
         -   [rect](component/js-components-svg-rect.md)
         -   [circle](component/js-components-svg-circle.md)
         -   [ellipse](component/js-components-svg-ellipse.md)
@@ -111,7 +111,7 @@
         -   [animateMotion](component/js-components-svg-animate-motion.md)
         -   [animateTransform](component/js-components-svg-animate-transform.md)
 
--   [自定义组件](component/js-components-custom.md)
+-   自定义组件
     -   [基本用法](component/js-components-custom-basic-usage.md)
     -   [自定义事件](component/js-components-custom-events.md)
     -   [Props](component/js-components-custom-props.md)
@@ -130,7 +130,7 @@
         -   [Notification模块](apis/js-apis-notification.md)
         -   [Context模块](apis/js-apis-Context.md)
 
-    - [基本功能](apis/js-apis-basic-features.md)
+    - 基本功能
         -   [应用上下文](apis/js-apis-system-app.md)
         -   [日志打印](apis/js-apis-basic-features-logs.md)
         -   [页面路由](apis/js-apis-system-router.md)
@@ -142,7 +142,7 @@
         -   [性能打点](apis/js-apis-bytrace.md)
         -   [分布式帐号管理](apis/js-apis-distributedaccount.md)
     
-    -   [媒体](apis/js-apis-multmedia.md)
+    -   媒体
         -   [音频管理](apis/js-apis-audio.md)
         -   [音频播放](apis/js-apis-media.md)
 
@@ -152,7 +152,7 @@
         -   [SIM卡管理](apis/js-apis-sim.md)
         -   [网络搜索](apis/js-apis-radio.md)
     
-    -   [数据管理](apis/js-apis-data.md)
+    -   数据管理
         -   [文件管理](apis/js-apis-fileio.md)
         -   [单版本分布式数据库](apis/js-apis-data-singlekvstore.md)
         -   [创建和获取分布式数据库](apis/js-apis-data-kvmanager.md)
@@ -161,7 +161,7 @@
         -   [数据类型描述](apis/js-apis-data-type.md)
         -   [轻量级存储](apis/js-apis-data-storage.md)
     
-    -   [设备管理](apis/js-apis-device-mgmt.md)
+    -   设备管理
         -   [设备信息](apis/js-apis-deviceinfo.md)
         -   [系统属性](apis/js-apis-systemparameter.md)
         -   [系统恢复](apis/js-apis-update.md)

zh-cn/application-dev/js-reference/apis/js-apis-fileio.md

@@ -57,7 +57,9 @@
 
 
 >![](../../public_sys-resources/icon-note.gif) **说明：** 
->从 API Version 6 开始支持。
+>
+>- 从 API Version 6 开始支持。
+>- 标记<sup>7+</sup>的接口从API Version 7开始支持。
 
 ## 导入模块<a name="zh-cn_topic_0000001208447259_s56d19203690d4782bfc74069abb6bd71"></a>
 
@@ -72,35 +74,8 @@ import fileio from '@ohos.fileio';
 ## 使用说明<a name="zh-cn_topic_0000001208447259_section17323786612"></a>
 
 使用该功能模块对文件/目录进行操作前，需要先获取其绝对路径。
-
-<a name="zh-cn_topic_0000001208447259_table859142263817"></a>
-<table><thead align="left"><tr id="zh-cn_topic_0000001208447259_row165922243812"><th class="cellrowborder" valign="top" width="21.6%" id="mcps1.1.4.1.1"><p id="zh-cn_topic_0000001208447259_p20593226383"><a name="zh-cn_topic_0000001208447259_p20593226383"></a><a name="zh-cn_topic_0000001208447259_p20593226383"></a>目录类型</p>
-</th>
-<th class="cellrowborder" valign="top" width="53.57000000000001%" id="mcps1.1.4.1.2"><p id="zh-cn_topic_0000001208447259_p125911229389"><a name="zh-cn_topic_0000001208447259_p125911229389"></a><a name="zh-cn_topic_0000001208447259_p125911229389"></a>说明</p>
-</th>
-<th class="cellrowborder" valign="top" width="24.830000000000002%" id="mcps1.1.4.1.3"><p id="zh-cn_topic_0000001208447259_p1177425414331"><a name="zh-cn_topic_0000001208447259_p1177425414331"></a><a name="zh-cn_topic_0000001208447259_p1177425414331"></a>相关接口</p>
-</th>
-</tr>
-</thead>
-<tbody><tr id="zh-cn_topic_0000001208447259_row14604221386"><td class="cellrowborder" valign="top" width="21.6%" headers="mcps1.1.4.1.1 "><p id="zh-cn_topic_0000001208447259_p0605228382"><a name="zh-cn_topic_0000001208447259_p0605228382"></a><a name="zh-cn_topic_0000001208447259_p0605228382"></a>内部存储的缓存目录</p>
-</td>
-<td class="cellrowborder" valign="top" width="53.57000000000001%" headers="mcps1.1.4.1.2 "><p id="zh-cn_topic_0000001208447259_p76010229385"><a name="zh-cn_topic_0000001208447259_p76010229385"></a><a name="zh-cn_topic_0000001208447259_p76010229385"></a>可读写，随时可能清除，不保证持久性。一般用作下载临时目录或缓存目录。</p>
-</td>
-<td class="cellrowborder" valign="top" width="24.830000000000002%" headers="mcps1.1.4.1.3 "><p id="zh-cn_topic_0000001208447259_p1677525420331"><a name="zh-cn_topic_0000001208447259_p1677525420331"></a><a name="zh-cn_topic_0000001208447259_p1677525420331"></a>getCacheDir</p>
-</td>
-</tr>
-<tr id="zh-cn_topic_0000001208447259_row20601622183813"><td class="cellrowborder" valign="top" width="21.6%" headers="mcps1.1.4.1.1 "><p id="zh-cn_topic_0000001208447259_p166062273813"><a name="zh-cn_topic_0000001208447259_p166062273813"></a><a name="zh-cn_topic_0000001208447259_p166062273813"></a>内部存储目录</p>
-</td>
-<td class="cellrowborder" valign="top" width="53.57000000000001%" headers="mcps1.1.4.1.2 "><p id="zh-cn_topic_0000001208447259_p19601522103813"><a name="zh-cn_topic_0000001208447259_p19601522103813"></a><a name="zh-cn_topic_0000001208447259_p19601522103813"></a>随应用卸载删除。</p>
-</td>
-<td class="cellrowborder" valign="top" width="24.830000000000002%" headers="mcps1.1.4.1.3 "><p id="zh-cn_topic_0000001208447259_p147753546339"><a name="zh-cn_topic_0000001208447259_p147753546339"></a><a name="zh-cn_topic_0000001208447259_p147753546339"></a>getFilesDir</p>
-</td>
-</tr>
-</tbody>
-</table>
-
-“文件/目录绝对路径”=“应用目录路径”+“文件/目录名”
-
+“文件/目录绝对路径”=“应用目录路径”+“文件/目录名”。
+应用目录路径可通过[Context模块的接口getOrCreateLocalDir](js-apis-Context.md)获取。
 通过上述接口获取到应用目录路径dir，文件名为“xxx.txt”，文件所在绝对路径为：
 
 ```
@@ -2129,4 +2104,3 @@ isSymbolicLink\(\): boolean
     let isSymbolicLink = dir.readSync().isSymbolicLink();
     ```
 
-

zh-cn/application-dev/js-reference/component/Readme-CN.md

@@ -80,9 +80,9 @@
     -   [grid-row](js-components-grid-row.md)
     -   [grid-col](js-components-grid-col.md)
 
--   [svg组件](js-components-svg.md)
+-   [svg组件](js-svg.md)
     -   [通用属性](js-components-svg-common-attributes.md)
-    -   [svg](js-components-svg-0.md)
+    -   [svg](js-components-svg.md)
     -   [rect](js-components-svg-rect.md)
     -   [circle](js-components-svg-circle.md)
     -   [ellipse](js-components-svg-ellipse.md)

zh-cn/application-dev/js-reference/component/js-components-svg-0.md

-# svg<a name="ZH-CN_TOPIC_0000001164577152"></a>
-
--   [权限列表](#zh-cn_topic_0000001173164705_section11257113618419)
--   [子组件](#zh-cn_topic_0000001173164705_section9288143101012)
--   [属性](#zh-cn_topic_0000001173164705_section2907183951110)
--   [示例](#zh-cn_topic_0000001173164705_section360556124815)
-
-基础容器，主要作为svg的根节点使用，也可以在svg中嵌套使用。
-
->![](../../public_sys-resources/icon-note.gif) **说明：** 
->从API Version 7 开始支持。
->约束条件：svg父组件或者svg组件需要定义宽高值，否则不进行绘制。
-
-## 权限列表<a name="zh-cn_topic_0000001173164705_section11257113618419"></a>
-
-无
-
-## 子组件<a name="zh-cn_topic_0000001173164705_section9288143101012"></a>
-
-支持svg、rect、circle、ellipse、path、line、polygon、polyline、text、animate、animateTransform。
-
-## 属性<a name="zh-cn_topic_0000001173164705_section2907183951110"></a>
-
-支持所列的Svg组件通用属性和以下表格的属性，设置的通用属性会传递给子组件。
-
-<a name="zh-cn_topic_0000001173164705_table20633101642315"></a>
-<table><thead align="left"><tr id="zh-cn_topic_0000001173164705_row663331618238"><th class="cellrowborder" valign="top" width="23.119999999999997%" id="mcps1.1.6.1.1"><p id="zh-cn_topic_0000001173164705_aaf1247770b244944bbcc9f28d9a6f00b"><a name="zh-cn_topic_0000001173164705_aaf1247770b244944bbcc9f28d9a6f00b"></a><a name="zh-cn_topic_0000001173164705_aaf1247770b244944bbcc9f28d9a6f00b"></a>名称</p>
-</th>
-<th class="cellrowborder" valign="top" width="23.119999999999997%" id="mcps1.1.6.1.2"><p id="zh-cn_topic_0000001173164705_a6efc3502761f4faf9630e484280f75b6"><a name="zh-cn_topic_0000001173164705_a6efc3502761f4faf9630e484280f75b6"></a><a name="zh-cn_topic_0000001173164705_a6efc3502761f4faf9630e484280f75b6"></a>类型</p>
-</th>
-<th class="cellrowborder" valign="top" width="10.48%" id="mcps1.1.6.1.3"><p id="zh-cn_topic_0000001173164705_a27a37273d9ad47569ddbcb8db985d302"><a name="zh-cn_topic_0000001173164705_a27a37273d9ad47569ddbcb8db985d302"></a><a name="zh-cn_topic_0000001173164705_a27a37273d9ad47569ddbcb8db985d302"></a>默认值</p>
-</th>
-<th class="cellrowborder" valign="top" width="7.5200000000000005%" id="mcps1.1.6.1.4"><p id="zh-cn_topic_0000001173164705_p824610360217"><a name="zh-cn_topic_0000001173164705_p824610360217"></a><a name="zh-cn_topic_0000001173164705_p824610360217"></a>必填</p>
-</th>
-<th class="cellrowborder" valign="top" width="35.76%" id="mcps1.1.6.1.5"><p id="zh-cn_topic_0000001173164705_a2ff3361bfd3b420ba4967452d2ddd098"><a name="zh-cn_topic_0000001173164705_a2ff3361bfd3b420ba4967452d2ddd098"></a><a name="zh-cn_topic_0000001173164705_a2ff3361bfd3b420ba4967452d2ddd098"></a>描述</p>
-</th>
-</tr>
-</thead>
-<tbody><tr id="zh-cn_topic_0000001173164705_row36332165231"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a83b6dd280109466fb015e64de1ef4df3"><a name="zh-cn_topic_0000001173164705_a83b6dd280109466fb015e64de1ef4df3"></a><a name="zh-cn_topic_0000001173164705_a83b6dd280109466fb015e64de1ef4df3"></a>id</p>
-</td>
-<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_abc38fa2b85854bc687af75eb17a00a4d"><a name="zh-cn_topic_0000001173164705_abc38fa2b85854bc687af75eb17a00a4d"></a><a name="zh-cn_topic_0000001173164705_abc38fa2b85854bc687af75eb17a00a4d"></a>string</p>
-</td>
-<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_a8d12e4af905d4743a5ec9cd6018d2972"><a name="zh-cn_topic_0000001173164705_a8d12e4af905d4743a5ec9cd6018d2972"></a><a name="zh-cn_topic_0000001173164705_a8d12e4af905d4743a5ec9cd6018d2972"></a>-</p>
-</td>
-<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p42461736102118"><a name="zh-cn_topic_0000001173164705_p42461736102118"></a><a name="zh-cn_topic_0000001173164705_p42461736102118"></a>否</p>
-</td>
-<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_a1a1731af05554f119fa365748f276bb2"><a name="zh-cn_topic_0000001173164705_a1a1731af05554f119fa365748f276bb2"></a><a name="zh-cn_topic_0000001173164705_a1a1731af05554f119fa365748f276bb2"></a>组件的唯一标识。</p>
-</td>
-</tr>
-<tr id="zh-cn_topic_0000001173164705_row13633131616239"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a97f90720f6ef448fb3afbb3b1c13ae25"><a name="zh-cn_topic_0000001173164705_a97f90720f6ef448fb3afbb3b1c13ae25"></a><a name="zh-cn_topic_0000001173164705_a97f90720f6ef448fb3afbb3b1c13ae25"></a>width</p>
-</td>
-<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_a165d9cd14ccf4127b2e22cc6397680ac"><a name="zh-cn_topic_0000001173164705_a165d9cd14ccf4127b2e22cc6397680ac"></a><a name="zh-cn_topic_0000001173164705_a165d9cd14ccf4127b2e22cc6397680ac"></a>&lt;length&gt;|&lt;percentage&gt;</p>
-</td>
-<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_a836c513375114f6dac7693e0b4f33230"><a name="zh-cn_topic_0000001173164705_a836c513375114f6dac7693e0b4f33230"></a><a name="zh-cn_topic_0000001173164705_a836c513375114f6dac7693e0b4f33230"></a>-</p>
-</td>
-<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p17246836142119"><a name="zh-cn_topic_0000001173164705_p17246836142119"></a><a name="zh-cn_topic_0000001173164705_p17246836142119"></a>否</p>
-</td>
-<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_adbe7ecbee96b4f938b04a4b8d62791bf"><a name="zh-cn_topic_0000001173164705_adbe7ecbee96b4f938b04a4b8d62791bf"></a><a name="zh-cn_topic_0000001173164705_adbe7ecbee96b4f938b04a4b8d62791bf"></a>设置组件的宽度</p>
-</td>
-</tr>
-<tr id="zh-cn_topic_0000001173164705_row10634131610230"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a4a0bae0e1bb946d6bc7bf30e0a535343"><a name="zh-cn_topic_0000001173164705_a4a0bae0e1bb946d6bc7bf30e0a535343"></a><a name="zh-cn_topic_0000001173164705_a4a0bae0e1bb946d6bc7bf30e0a535343"></a>height</p>
-</td>
-<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_p1346327134215"><a name="zh-cn_topic_0000001173164705_p1346327134215"></a><a name="zh-cn_topic_0000001173164705_p1346327134215"></a>&lt;length&gt;|&lt;percentage&gt;</p>
-</td>
-<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_p14463117184214"><a name="zh-cn_topic_0000001173164705_p14463117184214"></a><a name="zh-cn_topic_0000001173164705_p14463117184214"></a>-</p>
-</td>
-<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p1646316754213"><a name="zh-cn_topic_0000001173164705_p1646316754213"></a><a name="zh-cn_topic_0000001173164705_p1646316754213"></a>否</p>
-</td>
-<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p64638784216"><a name="zh-cn_topic_0000001173164705_p64638784216"></a><a name="zh-cn_topic_0000001173164705_p64638784216"></a>设置组件的高度</p>
-</td>
-</tr>
-<tr id="zh-cn_topic_0000001173164705_row1634171618236"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a3cf785e2a2a043268d168f58d59207c8"><a name="zh-cn_topic_0000001173164705_a3cf785e2a2a043268d168f58d59207c8"></a><a name="zh-cn_topic_0000001173164705_a3cf785e2a2a043268d168f58d59207c8"></a>x</p>
-</td>
-<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_aa9b258d23e1e425dbc2ffe8edbc91a42"><a name="zh-cn_topic_0000001173164705_aa9b258d23e1e425dbc2ffe8edbc91a42"></a><a name="zh-cn_topic_0000001173164705_aa9b258d23e1e425dbc2ffe8edbc91a42"></a>&lt;length&gt;|&lt;percentage&gt;</p>
-</td>
-<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_ac312df4f14444c98955ed055456848a7"><a name="zh-cn_topic_0000001173164705_ac312df4f14444c98955ed055456848a7"></a><a name="zh-cn_topic_0000001173164705_ac312df4f14444c98955ed055456848a7"></a>-</p>
-</td>
-<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p1624612362219"><a name="zh-cn_topic_0000001173164705_p1624612362219"></a><a name="zh-cn_topic_0000001173164705_p1624612362219"></a>否</p>
-</td>
-<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p62121758111517"><a name="zh-cn_topic_0000001173164705_p62121758111517"></a><a name="zh-cn_topic_0000001173164705_p62121758111517"></a>设置当前svg的x轴坐标，根svg节点无效</p>
-</td>
-</tr>
-<tr id="zh-cn_topic_0000001173164705_row1259531661611"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_p1359601671613"><a name="zh-cn_topic_0000001173164705_p1359601671613"></a><a name="zh-cn_topic_0000001173164705_p1359601671613"></a>y</p>
-</td>
-<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_p65967163165"><a name="zh-cn_topic_0000001173164705_p65967163165"></a><a name="zh-cn_topic_0000001173164705_p65967163165"></a>&lt;length&gt;|&lt;percentage&gt;</p>
-</td>
-<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 ">&nbsp;&nbsp;</td>
-<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p1059610169169"><a name="zh-cn_topic_0000001173164705_p1059610169169"></a><a name="zh-cn_topic_0000001173164705_p1059610169169"></a>否</p>
-</td>
-<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p125961416161611"><a name="zh-cn_topic_0000001173164705_p125961416161611"></a><a name="zh-cn_topic_0000001173164705_p125961416161611"></a>设置当前svg的y轴坐标，根svg节点无效</p>
-</td>
-</tr>
-<tr id="zh-cn_topic_0000001173164705_row11404114510176"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_p11404124541714"><a name="zh-cn_topic_0000001173164705_p11404124541714"></a><a name="zh-cn_topic_0000001173164705_p11404124541714"></a>viewBox</p>
-</td>
-<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_p1640474511172"><a name="zh-cn_topic_0000001173164705_p1640474511172"></a><a name="zh-cn_topic_0000001173164705_p1640474511172"></a>string</p>
-</td>
-<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_p740494521712"><a name="zh-cn_topic_0000001173164705_p740494521712"></a><a name="zh-cn_topic_0000001173164705_p740494521712"></a>-</p>
-</td>
-<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p04046452179"><a name="zh-cn_topic_0000001173164705_p04046452179"></a><a name="zh-cn_topic_0000001173164705_p04046452179"></a>否</p>
-</td>
-<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p740434541717"><a name="zh-cn_topic_0000001173164705_p740434541717"></a><a name="zh-cn_topic_0000001173164705_p740434541717"></a>设置当前svg的视口。支持的格式为&lt;number number number number&gt;，4个参数分别表示min-x, min-y, width and height，viewBox的宽高和svg的宽高不一致，会以中心对齐进行缩放。</p>
-</td>
-</tr>
-</tbody>
-</table>
-
-## 示例<a name="zh-cn_topic_0000001173164705_section360556124815"></a>
-
-```
-<!-- xxx.hml -->
-<div class="container">
-    <svg width="400" height="400">
-        <svg width="200" height="200" viewBox="0 0 100 100">
-            <rect x="10" y="10" width="80" height="80" fill="#00FF00"></rect>
-        </svg>
-        <rect x="10" y="10" width="80" height="80" fill="red" ></rect>
-        <svg x="0" y="0" width="200" height="200" viewBox="0 0 200 200">
-            <rect x="10" y="10" width="80" height="80" fill="red"></rect>
-        </svg>
-        <svg x="0" y="0" width="200" height="200" viewBox="0 0 400 400">
-            <rect x="10" y="10" width="80" height="80" fill="blue"></rect>
-        </svg>
-    </svg>
-</div>
-```
-
-![](figures/zh-cn_image_0000001173164789.png)
-

zh-cn/application-dev/js-reference/component/js-components-svg.md

-# svg组件<a name="ZH-CN_TOPIC_0000001164895644"></a>
-
--   **[通用属性](js-components-svg-common-attributes.md)**  
-
--   **[svg](js-components-svg-0.md)**  
-
--   **[rect](js-components-svg-rect.md)**  
-
--   **[circle](js-components-svg-circle.md)**  
-
--   **[ellipse](js-components-svg-ellipse.md)**  
-
--   **[path](js-components-svg-path.md)**  
-
--   **[line](js-components-svg-line.md)**  
-
--   **[polyline](js-components-svg-polyline.md)**  
-
--   **[polygon](js-components-svg-polygon.md)**  
-
--   **[text](js-components-svg-text.md)**  
-
--   **[tspan](js-components-svg-tspan.md)**  
-
--   **[textPath](js-components-svg-textpath.md)**  
-
--   **[animate](js-components-svg-animate.md)**  
-
--   **[animateMotion](js-components-svg-animate-motion.md)**  
-
--   **[animateTransform](js-components-svg-animate-transform.md)**  
-
+# svg<a name="ZH-CN_TOPIC_0000001164577152"></a>
+
+-   [权限列表](#zh-cn_topic_0000001173164705_section11257113618419)
+-   [子组件](#zh-cn_topic_0000001173164705_section9288143101012)
+-   [属性](#zh-cn_topic_0000001173164705_section2907183951110)
+-   [示例](#zh-cn_topic_0000001173164705_section360556124815)
+
+基础容器，主要作为svg的根节点使用，也可以在svg中嵌套使用。
+
+>![](../../public_sys-resources/icon-note.gif) **说明：** 
+>从API Version 7 开始支持。
+>约束条件：svg父组件或者svg组件需要定义宽高值，否则不进行绘制。
+
+## 权限列表<a name="zh-cn_topic_0000001173164705_section11257113618419"></a>
+
+无
+
+## 子组件<a name="zh-cn_topic_0000001173164705_section9288143101012"></a>
+
+支持svg、rect、circle、ellipse、path、line、polygon、polyline、text、animate、animateTransform。
+
+## 属性<a name="zh-cn_topic_0000001173164705_section2907183951110"></a>
+
+支持所列的Svg组件通用属性和以下表格的属性，设置的通用属性会传递给子组件。
+
+<a name="zh-cn_topic_0000001173164705_table20633101642315"></a>
+<table><thead align="left"><tr id="zh-cn_topic_0000001173164705_row663331618238"><th class="cellrowborder" valign="top" width="23.119999999999997%" id="mcps1.1.6.1.1"><p id="zh-cn_topic_0000001173164705_aaf1247770b244944bbcc9f28d9a6f00b"><a name="zh-cn_topic_0000001173164705_aaf1247770b244944bbcc9f28d9a6f00b"></a><a name="zh-cn_topic_0000001173164705_aaf1247770b244944bbcc9f28d9a6f00b"></a>名称</p>
+</th>
+<th class="cellrowborder" valign="top" width="23.119999999999997%" id="mcps1.1.6.1.2"><p id="zh-cn_topic_0000001173164705_a6efc3502761f4faf9630e484280f75b6"><a name="zh-cn_topic_0000001173164705_a6efc3502761f4faf9630e484280f75b6"></a><a name="zh-cn_topic_0000001173164705_a6efc3502761f4faf9630e484280f75b6"></a>类型</p>
+</th>
+<th class="cellrowborder" valign="top" width="10.48%" id="mcps1.1.6.1.3"><p id="zh-cn_topic_0000001173164705_a27a37273d9ad47569ddbcb8db985d302"><a name="zh-cn_topic_0000001173164705_a27a37273d9ad47569ddbcb8db985d302"></a><a name="zh-cn_topic_0000001173164705_a27a37273d9ad47569ddbcb8db985d302"></a>默认值</p>
+</th>
+<th class="cellrowborder" valign="top" width="7.5200000000000005%" id="mcps1.1.6.1.4"><p id="zh-cn_topic_0000001173164705_p824610360217"><a name="zh-cn_topic_0000001173164705_p824610360217"></a><a name="zh-cn_topic_0000001173164705_p824610360217"></a>必填</p>
+</th>
+<th class="cellrowborder" valign="top" width="35.76%" id="mcps1.1.6.1.5"><p id="zh-cn_topic_0000001173164705_a2ff3361bfd3b420ba4967452d2ddd098"><a name="zh-cn_topic_0000001173164705_a2ff3361bfd3b420ba4967452d2ddd098"></a><a name="zh-cn_topic_0000001173164705_a2ff3361bfd3b420ba4967452d2ddd098"></a>描述</p>
+</th>
+</tr>
+</thead>
+<tbody><tr id="zh-cn_topic_0000001173164705_row36332165231"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a83b6dd280109466fb015e64de1ef4df3"><a name="zh-cn_topic_0000001173164705_a83b6dd280109466fb015e64de1ef4df3"></a><a name="zh-cn_topic_0000001173164705_a83b6dd280109466fb015e64de1ef4df3"></a>id</p>
+</td>
+<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_abc38fa2b85854bc687af75eb17a00a4d"><a name="zh-cn_topic_0000001173164705_abc38fa2b85854bc687af75eb17a00a4d"></a><a name="zh-cn_topic_0000001173164705_abc38fa2b85854bc687af75eb17a00a4d"></a>string</p>
+</td>
+<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_a8d12e4af905d4743a5ec9cd6018d2972"><a name="zh-cn_topic_0000001173164705_a8d12e4af905d4743a5ec9cd6018d2972"></a><a name="zh-cn_topic_0000001173164705_a8d12e4af905d4743a5ec9cd6018d2972"></a>-</p>
+</td>
+<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p42461736102118"><a name="zh-cn_topic_0000001173164705_p42461736102118"></a><a name="zh-cn_topic_0000001173164705_p42461736102118"></a>否</p>
+</td>
+<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_a1a1731af05554f119fa365748f276bb2"><a name="zh-cn_topic_0000001173164705_a1a1731af05554f119fa365748f276bb2"></a><a name="zh-cn_topic_0000001173164705_a1a1731af05554f119fa365748f276bb2"></a>组件的唯一标识。</p>
+</td>
+</tr>
+<tr id="zh-cn_topic_0000001173164705_row13633131616239"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a97f90720f6ef448fb3afbb3b1c13ae25"><a name="zh-cn_topic_0000001173164705_a97f90720f6ef448fb3afbb3b1c13ae25"></a><a name="zh-cn_topic_0000001173164705_a97f90720f6ef448fb3afbb3b1c13ae25"></a>width</p>
+</td>
+<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_a165d9cd14ccf4127b2e22cc6397680ac"><a name="zh-cn_topic_0000001173164705_a165d9cd14ccf4127b2e22cc6397680ac"></a><a name="zh-cn_topic_0000001173164705_a165d9cd14ccf4127b2e22cc6397680ac"></a>&lt;length&gt;|&lt;percentage&gt;</p>
+</td>
+<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_a836c513375114f6dac7693e0b4f33230"><a name="zh-cn_topic_0000001173164705_a836c513375114f6dac7693e0b4f33230"></a><a name="zh-cn_topic_0000001173164705_a836c513375114f6dac7693e0b4f33230"></a>-</p>
+</td>
+<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p17246836142119"><a name="zh-cn_topic_0000001173164705_p17246836142119"></a><a name="zh-cn_topic_0000001173164705_p17246836142119"></a>否</p>
+</td>
+<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_adbe7ecbee96b4f938b04a4b8d62791bf"><a name="zh-cn_topic_0000001173164705_adbe7ecbee96b4f938b04a4b8d62791bf"></a><a name="zh-cn_topic_0000001173164705_adbe7ecbee96b4f938b04a4b8d62791bf"></a>设置组件的宽度</p>
+</td>
+</tr>
+<tr id="zh-cn_topic_0000001173164705_row10634131610230"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a4a0bae0e1bb946d6bc7bf30e0a535343"><a name="zh-cn_topic_0000001173164705_a4a0bae0e1bb946d6bc7bf30e0a535343"></a><a name="zh-cn_topic_0000001173164705_a4a0bae0e1bb946d6bc7bf30e0a535343"></a>height</p>
+</td>
+<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_p1346327134215"><a name="zh-cn_topic_0000001173164705_p1346327134215"></a><a name="zh-cn_topic_0000001173164705_p1346327134215"></a>&lt;length&gt;|&lt;percentage&gt;</p>
+</td>
+<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_p14463117184214"><a name="zh-cn_topic_0000001173164705_p14463117184214"></a><a name="zh-cn_topic_0000001173164705_p14463117184214"></a>-</p>
+</td>
+<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p1646316754213"><a name="zh-cn_topic_0000001173164705_p1646316754213"></a><a name="zh-cn_topic_0000001173164705_p1646316754213"></a>否</p>
+</td>
+<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p64638784216"><a name="zh-cn_topic_0000001173164705_p64638784216"></a><a name="zh-cn_topic_0000001173164705_p64638784216"></a>设置组件的高度</p>
+</td>
+</tr>
+<tr id="zh-cn_topic_0000001173164705_row1634171618236"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_a3cf785e2a2a043268d168f58d59207c8"><a name="zh-cn_topic_0000001173164705_a3cf785e2a2a043268d168f58d59207c8"></a><a name="zh-cn_topic_0000001173164705_a3cf785e2a2a043268d168f58d59207c8"></a>x</p>
+</td>
+<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_aa9b258d23e1e425dbc2ffe8edbc91a42"><a name="zh-cn_topic_0000001173164705_aa9b258d23e1e425dbc2ffe8edbc91a42"></a><a name="zh-cn_topic_0000001173164705_aa9b258d23e1e425dbc2ffe8edbc91a42"></a>&lt;length&gt;|&lt;percentage&gt;</p>
+</td>
+<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_ac312df4f14444c98955ed055456848a7"><a name="zh-cn_topic_0000001173164705_ac312df4f14444c98955ed055456848a7"></a><a name="zh-cn_topic_0000001173164705_ac312df4f14444c98955ed055456848a7"></a>-</p>
+</td>
+<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p1624612362219"><a name="zh-cn_topic_0000001173164705_p1624612362219"></a><a name="zh-cn_topic_0000001173164705_p1624612362219"></a>否</p>
+</td>
+<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p62121758111517"><a name="zh-cn_topic_0000001173164705_p62121758111517"></a><a name="zh-cn_topic_0000001173164705_p62121758111517"></a>设置当前svg的x轴坐标，根svg节点无效</p>
+</td>
+</tr>
+<tr id="zh-cn_topic_0000001173164705_row1259531661611"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_p1359601671613"><a name="zh-cn_topic_0000001173164705_p1359601671613"></a><a name="zh-cn_topic_0000001173164705_p1359601671613"></a>y</p>
+</td>
+<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_p65967163165"><a name="zh-cn_topic_0000001173164705_p65967163165"></a><a name="zh-cn_topic_0000001173164705_p65967163165"></a>&lt;length&gt;|&lt;percentage&gt;</p>
+</td>
+<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 ">&nbsp;&nbsp;</td>
+<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p1059610169169"><a name="zh-cn_topic_0000001173164705_p1059610169169"></a><a name="zh-cn_topic_0000001173164705_p1059610169169"></a>否</p>
+</td>
+<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p125961416161611"><a name="zh-cn_topic_0000001173164705_p125961416161611"></a><a name="zh-cn_topic_0000001173164705_p125961416161611"></a>设置当前svg的y轴坐标，根svg节点无效</p>
+</td>
+</tr>
+<tr id="zh-cn_topic_0000001173164705_row11404114510176"><td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173164705_p11404124541714"><a name="zh-cn_topic_0000001173164705_p11404124541714"></a><a name="zh-cn_topic_0000001173164705_p11404124541714"></a>viewBox</p>
+</td>
+<td class="cellrowborder" valign="top" width="23.119999999999997%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173164705_p1640474511172"><a name="zh-cn_topic_0000001173164705_p1640474511172"></a><a name="zh-cn_topic_0000001173164705_p1640474511172"></a>string</p>
+</td>
+<td class="cellrowborder" valign="top" width="10.48%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173164705_p740494521712"><a name="zh-cn_topic_0000001173164705_p740494521712"></a><a name="zh-cn_topic_0000001173164705_p740494521712"></a>-</p>
+</td>
+<td class="cellrowborder" valign="top" width="7.5200000000000005%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173164705_p04046452179"><a name="zh-cn_topic_0000001173164705_p04046452179"></a><a name="zh-cn_topic_0000001173164705_p04046452179"></a>否</p>
+</td>
+<td class="cellrowborder" valign="top" width="35.76%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173164705_p740434541717"><a name="zh-cn_topic_0000001173164705_p740434541717"></a><a name="zh-cn_topic_0000001173164705_p740434541717"></a>设置当前svg的视口。支持的格式为&lt;number number number number&gt;，4个参数分别表示min-x, min-y, width and height，viewBox的宽高和svg的宽高不一致，会以中心对齐进行缩放。</p>
+</td>
+</tr>
+</tbody>
+</table>
+
+## 示例<a name="zh-cn_topic_0000001173164705_section360556124815"></a>
+
+```
+<!-- xxx.hml -->
+<div class="container">
+    <svg width="400" height="400">
+        <svg width="200" height="200" viewBox="0 0 100 100">
+            <rect x="10" y="10" width="80" height="80" fill="#00FF00"></rect>
+        </svg>
+        <rect x="10" y="10" width="80" height="80" fill="red" ></rect>
+        <svg x="0" y="0" width="200" height="200" viewBox="0 0 200 200">
+            <rect x="10" y="10" width="80" height="80" fill="red"></rect>
+        </svg>
+        <svg x="0" y="0" width="200" height="200" viewBox="0 0 400 400">
+            <rect x="10" y="10" width="80" height="80" fill="blue"></rect>
+        </svg>
+    </svg>
+</div>
+```
+
+![](figures/zh-cn_image_0000001173164789.png)
 

zh-cn/application-dev/media/Readme-CN.md

 # 媒体
 
--   [音频](audio.md)
+- 音频
     - [音频开发概述](audio-overview.md)
     - [音频播放开发指导](audio-playback.md)
     - [音频管理开发指导](audio-management.md)

zh-cn/application-dev/media/audio.md

-# 音频<a name="ZH-CN_TOPIC_0000001110946022"></a>
+# 音频
+
 
 - **[音频开发概述](audio-overview.md)**
 
@@ -7,5 +8,3 @@
 - **[音频管理开发指导](audio-management.md)**
 
 - **[音频录制开发指导](audio-recorder.md)**
\ No newline at end of file
-
-