border-image-slice
属性用于定义如何将图像切片以创建可重复的边框。该属性指定一个四值的值,每个值表示四周的切片大小。它可以是一个百分比或长度值,每个值之间可以使用空格分隔。值的含义如下:
- 第一个值表示上边框的切片宽度。
- 第二个值表示右边框的切片宽度。
- 第三个值表示下边框的切片宽度。
- 第四个值表示左边框的切片宽度。
如果没有指定第四个值,则它等于第二个值,否则该值将应用于左边框。
例如:
border-image-slice: 10% 20% 30% 40%;
在此示例中,上边框将使用图像的前10%进行切片,右边框将使用图像的中间20%进行切片,下边框将使用图像的后30%进行切片,左边框将使用图像的中间40%进行切片。
同时,如果您希望图像中心位置的切片区域大小与其它四周一样,可以将百分比值设置为"fill",例如:
border-image-slice: 10% 20% fill 40%;