diff --git a/en/application-dev/reference/apis/js-apis-display.md b/en/application-dev/reference/apis/js-apis-display.md
index 1c65dc5b714318588bfe1666466003a56809f38d..72dfe4beb9d6151dfab5acf8636711b1437e7c3d 100644
--- a/en/application-dev/reference/apis/js-apis-display.md
+++ b/en/application-dev/reference/apis/js-apis-display.md
@@ -1,6 +1,6 @@
 # Display
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**<br/>
 > The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version.
 
 ## Modules to Import
@@ -58,13 +58,12 @@ Obtains the default display object.
 
 **System capabilities**: SystemCapability.WindowManager.WindowManager.Core
 
-- Parameters
+**Parameters**
   | Name| Type| Mandatory| Description|
   | -------- | -------- | -------- | -------- |
   | callback | AsyncCallback&lt;[Display](#display)&gt; | Yes| Callback used to return the default display object.|
 
-- Example
-
+**Example**
   ```js
   var displayClass = null;
   display.getDefaultDisplay((err, data) => {
@@ -85,13 +84,13 @@ Obtains the default display object.
 
 **System capabilities**: SystemCapability.WindowManager.WindowManager.Core
 
-- Return value
+**Return value**
 
   | Type                              | Description                                          |
   | ---------------------------------- | ---------------------------------------------- |
   | Promise&lt;[Display](#display)&gt; | Promise used to return the default display object.|
 
-- Example
+**Example**
 
   ```js
   let promise = display.getDefaultDisplay();
@@ -110,13 +109,13 @@ Obtains all the display objects.
 
 **System capabilities**: SystemCapability.WindowManager.WindowManager.Core
 
-- Parameters
+**Parameters**
 
   | Name  | Type                                                | Mandatory| Description                           |
   | -------- | ---------------------------------------------------- | ---- | ------------------------------- |
   | callback | AsyncCallback&lt;Array&lt;[Display](#display)&gt;&gt; | Yes  | Callback used to return all the display objects.|
 
-- Example
+**Example**
 
   ```js
   display.getAllDisplay((err, data) => {
@@ -136,13 +135,13 @@ Obtains all the display objects.
 
 **System capabilities**: SystemCapability.WindowManager.WindowManager.Core
 
-- Return value
+**Return value**
 
   | Type                                           | Description                                                   |
   | ----------------------------------------------- | ------------------------------------------------------- |
   | Promise&lt;Array&lt;[Display](#display)&gt;&gt; | Promise used to return an array containing all the display objects.|
 
-- Example
+**Example**
 
   ```js
   let promise = display.getAllDisplay();
@@ -161,14 +160,13 @@ Enables listening.
 
 **System capabilities**: SystemCapability.WindowManager.WindowManager.Core
 
-- Parameters
+**Parameters**
   | Name| Type| Mandatory| Description|
   | -------- | -------- | -------- | -------- |
   | type | string | Yes| Listening type. The available values are as follows:<br>-&nbsp;**add**: listening for whether a display is added<br>-&nbsp;**remove**: listening for whether a display is removed<br>-&nbsp;**change**: listening for whether a display is changed|
   | callback | Callback&lt;number&gt; | Yes| Callback used to return the ID of the display.|
 
-- Example
-
+**Example**
   ```js
   var type = "add";
   var callback = (data) => {
@@ -186,14 +184,13 @@ Disables listening.
 
 **System capabilities**: SystemCapability.WindowManager.WindowManager.Core
 
-- Parameters
+**Parameters**
   | Name| Type| Mandatory| Description|
   | -------- | -------- | -------- | -------- |
   | type | string | Yes| Listening type. The available values are as follows:<br>-&nbsp;**add**: listening for whether a display is added<br>-&nbsp;**remove**: listening for whether a display is removed<br>-&nbsp;**change**: listening for whether a display is changed|
   | callback | Callback&lt;number&gt; | No| Callback used to return the ID of the display.|
 
-- Example
-
+**Example**
   ```js
   var type = "remove";
   display.off(type);
diff --git a/en/application-dev/reference/apis/js-apis-screenshot.md b/en/application-dev/reference/apis/js-apis-screenshot.md
index 59e34a4d8e14f4d8c02283e41ab24fb6182e6429..cd33c37764b39dbf11bd630a3b3fba3ac45a1f92 100644
--- a/en/application-dev/reference/apis/js-apis-screenshot.md
+++ b/en/application-dev/reference/apis/js-apis-screenshot.md
@@ -1,6 +1,6 @@
 # Screenshot
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**<br/>
 > The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version.
 
 ## Modules to Import
@@ -58,14 +58,14 @@ Takes a screenshot and saves it as a **PixelMap** object. This method uses a cal
 
 **Required permissions**: ohos.permission.CAPTURE_SCREEN
 
-- Parameters
+**Parameters**
 
   | Name  | Type                                   | Mandatory| Description                                                        |
   | -------- | --------------------------------------- | ---- | ------------------------------------------------------------ |
   | options  | [ScreenshotOptions](#screenshotoptions) | No  | Screenshot options, which consist of **screenRect**, **imageSize**, and **rotation**. You need to set these parameters.|
   | callback | AsyncCallback&lt;image.PixelMap&gt;     | Yes  | Callback used to return a **PixelMap** object.                                  |
 
-- Example
+**Example**
 
   ```js
   var ScreenshotOptions = {
@@ -98,19 +98,19 @@ Takes a screenshot and saves it as a **PixelMap** object. This method uses a pro
 
 **Required permissions**: ohos.permission.CAPTURE_SCREEN
 
-- Parameters
+**Parameters**
 
   | Name | Type                                   | Mandatory| Description                                                        |
   | ------- | --------------------------------------- | ---- | ------------------------------------------------------------ |
   | options | [ScreenshotOptions](#screenshotoptions) | No  | Screenshot options, which consist of **screenRect**, **imageSize**, and **rotation**. You need to set these parameters.|
 
-- Return value
+**Return value**
 
   | Type                         | Description                                           |
   | ----------------------------- | ----------------------------------------------- |
   | Promise&lt;image.PixelMap&gt; | Promise used to return an **image.PixelMap** object.|
 
-- Example
+**Example**
 
   ```js
   var ScreenshotOptions = {
diff --git a/en/application-dev/reference/apis/js-apis-webgl.md b/en/application-dev/reference/apis/js-apis-webgl.md
index 677ae513e3504936baba16ec9fcb545ab3abca66..93a0097271884f8fb6a1db27be251d658c2a63b7 100644
--- a/en/application-dev/reference/apis/js-apis-webgl.md
+++ b/en/application-dev/reference/apis/js-apis-webgl.md
@@ -1,6 +1,6 @@
 # webgl
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**<br/>
 > The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version.
 
 
@@ -11,18 +11,18 @@ This module provides WebGL APIs that correspond to the OpenGL ES 2.0 feature set
 
 Create a **<canvas\>** component in the HML file. The following is an example:
 
-  
+
 ```
-<div class="container">
-    <canvas ref="canvas1" style="width : 400px; height : 200px; background-color : lightyellow;"></canvas>
+
+    
     <button class="btn-button" onclick="BtnDraw2D">BtnDraw2D</button>
-</div>
+
 ```
 
 Obtain the **<canvas\>** component instance in the JS file. The following is an example:
 
-  
-```
+
+```js
 // Obtain the <canvas> component instance.
 const el = this.$refs.canvas1;
 // Obtain the WebGL context from the <canvas> component instance.
diff --git a/en/application-dev/reference/apis/js-apis-webgl2.md b/en/application-dev/reference/apis/js-apis-webgl2.md
index 330516d3259f9219cba1ade2189e53fee066941f..3f96a4e9ad839f6201c1303c2f6bad2dce249ab7 100644
--- a/en/application-dev/reference/apis/js-apis-webgl2.md
+++ b/en/application-dev/reference/apis/js-apis-webgl2.md
@@ -1,6 +1,6 @@
 # webgl2
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**<br/>
 > The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version.
 
 
@@ -11,18 +11,18 @@ This module provides WebGL APIs that correspond to the OpenGL ES 3.0 feature set
 
 Create a **<canvas\>** component in the HML file. The following is an example:
 
-  
+
 ```
-<div class="container">
-    <canvas ref="canvas1" style="width : 400px; height : 200px; background-color : lightyellow;"></canvas>
+
+    
     <button class="btn-button" onclick="BtnDraw2D">BtnDraw2D</button>
-</div>
+
 ```
 
 Obtain the **<canvas\>** component instance in the JS file. The following is an example:
 
-  
-```
+
+```js
 // Obtain the <canvas> component instance.
 const el = this.$refs.canvas1;
 // Obtain the WebGL context from the <canvas> component instance.