CSS 属性：border-image-slice
将图像分割成若干部分，用作边框图像的角和边缘。
将图像分割成九个部分：四个角、四个边缘和一个中间部分。这是通过沿四条直线（分别从顶部、右侧、底部和左侧向内偏移）来分割图像实现的。
可能的值
| 值 | 描述 | 示例 |
|---|---|---|
| [percentage] | 顶部、右侧、底部和左侧的偏移量。根据图像尺寸计算。不应为负值。 | 25% |
| [数字] | 顶部、右侧、底部和左侧的偏移量。对于栅格图像，相当于像素；对于矢量图像，相当于坐标。不应为负值。 | 13 |
| [值] [值] | 第一个值为顶部和底部偏移量。第二个值为右侧和左侧偏移量。 | 25% 10% |
| [值] [值] [值] | 第一个值为顶部偏移量。第二个值为右侧和左侧偏移量。第三个值为底部偏移量。 | 13 30 7 |
| [值] [值] [值] [值] | 第一个值为顶部偏移量。第二个值为右侧偏移量。第三个值为底部偏移量。第四个值为左侧偏移量。 | 25% 10% 5% 15% |
[值] fill | 中间部分将被保留并绘制在背景之上。如果不存在 fill，则中间部分将被丢弃。 | 13 30 7 1 fill |
inherit | ||
initial | ||
unset | ||
示例
aside {
border: 10px solid fuchsia;
border-image-source: url("fluffy.png");
border-image-slice: 13 30 7 1;
}
/* - Sets "fluffy.png" as the border image on a 10-pixel wide border with a solid fuchsia-colored fallback.
- Top slice is 13 pixels in from the top edge of the image.
- Right slice is 30 pixels in from the right edge of the image.
- Bottom slice is 7 pixels in from the bottom edge of the image.
- Left slice is 1 pixel in from the left edge of the image.
- Middle portion is discarded (because fill is not present) */