css border-image-slice attribute

border

UK[ˈbɔ:də(r)] US[ˈbɔ:rdə(r)]

n.Border; edge; edging; wrapping Edge

vt.& vi. Bound with, on the edge of...

vt. Along the edge of, surround..., edge...

vi. Approximate, adjacent

Third person singular: borders Plural: borders Present participle: bordering Past tense: bordered Past participle: bordered

image

英[ ˈɪmɪdʒ] 美[ˈɪmɪdʒ]

##n.Image; portrait; concept, intention; mirror image, image

vt.Reflection; imagination; image of; symbol

Third person singular: images Plural: images Present participle: imaging Past tense: imaged Past participle: imaged

slice

英[slaɪs] 美[slaɪs]

vt. Cut into slices; cut off; divide

n. Thin slice; part; (a curveball hit due to a mistake)

vi. Slant shot

Third person singular: slices Plural: slices Present participle: slicing Past tense: sliced ​​Past participle: sliced

css border-image-slice attributesyntax

Function: Specifies the inward offset of the image border.

Syntax: border-image-slice: number|%|fill;

##Description: number numeric value, representing the value in the image Pixels (if a raster image) or vector coordinates (if a vector image). % A percentage value relative to the image size: the width of the image affects the horizontal offset, and the height affects the vertical offset. fill preserves the middle part of the border image.

Note: This attribute specifies the inward offset of the top, right, bottom, and left edges of the image. The image is divided into nine areas: four corners, four sides, and one middle area. Unless the fill keyword is used, the middle portion of the image is discarded. If the fourth value/percentage is omitted, it is the same as the second value. If the third value is omitted, it is the same as the first value. If the second value is omitted, it is the same as the first value.

css border-image-slice attributeexample

div{
border-image-source: url(http://img.php.cn/upload/article/000/005/656/5af270fd37755429.jpg);
border-image-slice: 50% 50%;
}