Style borderImage Property

Definition and Usage

borderImage This property is a shorthand for setting the following properties:

Omitted values are set to their default values.

See also:

CSS Reference Manual:border-image Property

Example

Specify the image as the border of the <div> element:

document.getElementById("myDIV").style.borderImage = "url(border.png) 30 30 round";

Try It Yourself

Syntax

Return borderImage Property:

object.style.borderImage

Set borderImage Property:

object.style.borderImage = "source slice width outset repeat|initial|inherit"

Property Value

Value Description
borderImageSource The path of the image to be used as the border.
borderImageSlice The inward offset of the image border.
borderImageWidth The width of the image border.
borderImageOutset The amount that the border image area exceeds the border box.
borderImageRepeat The border image should be tiled (repeated), filled (rounded), or stretched (stretched).
initial Sets this property to its default value. See also initial.
inherit Inherits this property from its parent element. See also inherit.

Technical Details

Default Value: none 100% 1 0 stretch
Return Value: A string that represents the element's border-image Property.
CSS Version: CSS3

Browser Support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
16.0 11.0 15.0 6.0 15.0