From 9485258ff646515f30191f69afa447e0a258ac04 Mon Sep 17 00:00:00 2001 From: "ester.zhou" Date: Wed, 19 Jul 2023 15:25:02 +0800 Subject: [PATCH] Update docs (20120) Signed-off-by: ester.zhou --- .../js-service-widget-ui/js-service-widget-basic-image.md | 2 +- .../js-service-widget-ui/js-service-widget-common-styles.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/en/application-dev/reference/js-service-widget-ui/js-service-widget-basic-image.md b/en/application-dev/reference/js-service-widget-ui/js-service-widget-basic-image.md index 3940ce7fb3..48f7c2b9fa 100644 --- a/en/application-dev/reference/js-service-widget-ui/js-service-widget-basic-image.md +++ b/en/application-dev/reference/js-service-widget-ui/js-service-widget-basic-image.md @@ -18,7 +18,7 @@ In addition to the [universal attributes](js-service-widget-common-attributes.md | Name| Type| Default Value| Mandatory| Description| | -------- | -------- | -------- | -------- | -------- | -| src | string | - | No| Image path.
- The local path is supported. Supported formats are as follows: PNG, JPG, BMP, SVG, and GIF.
- The path to the in-memory image is also supported in the scheme format of **memory://**.| +| src | string | - | No| Image path.
- The local path is supported. Supported formats are as follows: PNG, JPG, BMP, SVG, and GIF.
- The path to the in-memory image is also supported in the scheme format of **memory://**.
**NOTE**
To display an online image, download it and then access it with its in-memory path. Do not use URLs.| | alt | string | - | No| Placeholder image displayed during image loading.| diff --git a/en/application-dev/reference/js-service-widget-ui/js-service-widget-common-styles.md b/en/application-dev/reference/js-service-widget-ui/js-service-widget-common-styles.md index 31b25496a0..a113b5d28c 100644 --- a/en/application-dev/reference/js-service-widget-ui/js-service-widget-common-styles.md +++ b/en/application-dev/reference/js-service-widget-ui/js-service-widget-common-styles.md @@ -33,7 +33,7 @@ You can set universal styles for components in the **style** attribute or **.css | border-[top\|bottom]-[left\|right]-radius | <length> | - | Attribute to respectively set the radii of upper-left, upper-right, lower-right, and lower-left rounded corners. | | background | <linear-gradient> | - | Background. This attribute supports [gradient styles](js-service-widget-common-gradient.md) only and is not compatible with **background-color** or **background-image**.| | background-color | <color> | - | Background color.| -| background-image | string | - | Background image. This attribute is not compatible with **background-color** or **background**. Local image resources are supported.
Example:
- background-image: url("/common/background.png")
The SVG format is not supported.| +| background-image | string | - | Background image. This attribute is not compatible with **background-color** or **background**. Local image resources are supported.
Example:
- background-image: url("/common/background.png")
The SVG format is not supported.
To display an online image, download it and then access it with its in-memory path. Do not use URLs.| | background-size | - string
- <length> <length>
- <percentage> <percentage> | auto | Background image size.
- The available values of the **string** type are as follows:
- **contain**: extends the image to the maximum size so that its height and width are fully applicable to the content area.
- **cover**: extends the background image to a large enough size so that it completely covers the background area. Some parts of the image may not be displayed in the background area.
- **auto**: retains the original aspect ratio of the image.
- The two **\** values are as follows:
The first value indicates the width, and the second value indicates the height. If you only set one value, the other value is set to **auto** by default.
- The two **\** values are as follows:
The first value indicates the width, and the second value indicates the height. If you only set one value, the other value is set to **auto** by default. | | background-repeat | string | repeat | How a background image is repeatedly drawn. By default, a background image is repeated both horizontally and vertically.
- **repeat**: The image is repeated along both the x-axis and y-axis.
- **repeat-x**: The image is repeated along the x-axis.
- **repeat-y**: The image is repeated along the y-axis.
- **no-repeat**: The image is not repeated.| | background-position | - string string
- <length> <length>
- <percentage> <percentage> | 0px 0px | - Using keywords: If only one keyword is specified, the other value is **center** by default. The two values define the horizontal position and vertical position, respectively.
- **left**: leftmost in the horizontal direction.
- **right**: rightmost in the horizontal direction.
- **top**: top in the vertical direction.
- **bottom**: bottom in the vertical direction.
- **center**: center in the horizontal or vertical direction.
- Using **\**: The first value indicates the horizontal position, and the second value indicates the vertical position. For the upper left corner, the value is 0 0 in px (**0px 0px**). If only one value is specified, the other one is **50%**.
- Using **\**: The first value indicates the horizontal position, and the second value indicates the vertical position. For the upper left corner, the value is 0% 0%. For the lower right corner, the value is **100% 100%**. If only one value is specified, the other one is **50%**.
- Using both **\** and **\**.| -- GitLab