From 5e71f3812c109fee21db5ff263fe3106e13f586e Mon Sep 17 00:00:00 2001 From: Tianyi Tao Date: Wed, 18 Sep 2024 18:55:06 +0800 Subject: [PATCH 1/4] [zh-cn]: update the translation of `css-border-image-slice` --- files/zh-cn/web/css/border-image-slice/index.md | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/files/zh-cn/web/css/border-image-slice/index.md b/files/zh-cn/web/css/border-image-slice/index.md index 9cb869055874b0..f31c5500774653 100644 --- a/files/zh-cn/web/css/border-image-slice/index.md +++ b/files/zh-cn/web/css/border-image-slice/index.md @@ -1,6 +1,8 @@ --- title: border-image-slice slug: Web/CSS/border-image-slice +l10n: + sourceCommit: b2af4eb16dd4c399ed81f67efd49777fa6ae9030 --- {{CSSRef}} @@ -51,8 +53,8 @@ border-image-slice: unset; - 仅指定了**一**个位置（1 个值）时，创建的（上下左右）四个切片将具有相同的宽度/高度。 - 当指定了**两**个位置（2 个值）时，第一个值表示垂直方向的两个切片的高度（即 **top** 与 **bottom**），第二个值表示水平方向两侧切片的宽度（即 **left** 和 **right**）。 -- 当指定了**三**个位置（3 个值）时，第一个值表示顶部切片的高度（即 **top**），第二个值表示水平方向两侧切片的宽度（即 **left** 和 **right**），第三个值则表示底部切片的高度（即 **buttom**）。 -- 当指定了**四**个位置（4 个值）时，这四个值则分别对应 **top**、**right**、**buttom**、**left**（上、右、下、左）四个切片的宽度/高度。 +- 当指定了**三**个位置（3 个值）时，第一个值表示顶部切片的高度（即 **top**），第二个值表示水平方向两侧切片的宽度（即 **left** 和 **right**），第三个值则表示底部切片的高度（即 **bottom**）。 +- 当指定了**四**个位置（4 个值）时，这四个值则分别对应 **top**、**right**、**bottom**、**left**（上、右、下、左）四个切片的宽度/高度。 可选值 `fill` 可放在上面声明的值的末尾。 @@ -176,3 +178,4 @@ sliceSlider.addEventListener("input", () => { ## 参见 - [图解说明 1 到 4 个值的语法](/zh-CN/docs/Web/CSS/Shorthand_properties#tricky_edge_cases) +- [CSS中的边框图像：Interop 2023的关键关注领域]（/zh-CN/blog/border-images-interop-2023/）在 MDN 博客（2023） From d23dd2a8b13d4f01e9025856f1e67df7488cab22 Mon Sep 17 00:00:00 2001 From: A1lo Date: Thu, 19 Sep 2024 07:59:55 +0800 Subject: [PATCH 2/4] Update index.md --- files/zh-cn/web/css/border-image-slice/index.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/files/zh-cn/web/css/border-image-slice/index.md b/files/zh-cn/web/css/border-image-slice/index.md index f31c5500774653..84d368c34d23f3 100644 --- a/files/zh-cn/web/css/border-image-slice/index.md +++ b/files/zh-cn/web/css/border-image-slice/index.md @@ -11,7 +11,7 @@ l10n: {{EmbedInteractiveExample("pages/css/border-image-slice.html")}} -切分过程会将图像分割为 9 个区域：四个角、四个边（edges）以及中心区域。四条切片线，从它们各自的侧面设置给定距离，控制区域的大小。 +切分过程会将图像分割为 9 个区域：四个角、四个边（edge）以及中心区域。四条切片线，从它们各自的侧面设置给定距离，控制区域的大小。 ![由 border-image 或 border-image-slice 属性定义的九个区域](border-image-slice.png) @@ -105,12 +105,12 @@ border-image-slice: 30;