HTML and CSS Reference
In-Depth Information
Name
border-image-slice
Values:
[<number> | <percentage>]{1,4} &&
fill
?
Initial value:
100%
Applies to:
All elements excepttable elements where
border-collapse
is
collapse
Inherited:
No
Percentages:
Refer to the size of the border image
Computed value:
Same as declared value
Description:
Defines “slice distances,” which are offsets from the top, right, bottom, and left edges of the
border image. Taken together, they divide the image into nine regions, which correspond to
the eight segments of the element's border (four corners and four sides) and the element's
background area.
In cases where two opposite regions combine to exceed the total of the dimension they share,
both are made completely transparent. For example, if the top slice offset value is
10
and the
bottom slice offset value is
20
, but the source image is only 25 pixels tall, the two exceed the
height of the image. Thus, both the top and bottom segments of the border will be entirely
transparent. The same holds for right and left slices and width. Corners are never forcibly
made transparent, even in cases where their slices may overlap in the source image.
