THE WORLD'S LARGEST WEB DEVELOPER SITE

CSS3 border-image-source Property


Example

Specify an image as the border around an element:

#borderimg {
    border-image-source: url(border.png);
}

Try it yourself »

Definition and Usage

The border-image-source property specifies the path to the image to be used as a border (instead of the normal border around an element).

Tip: If the value is "none", or if the image cannot be displayed, the border styles will be used.

Tip: Also look at the border-image property (a shorthand property for setting all the border-image-* properties).

Default value: none
Inherited: no
Animatable: no. Read about animatable
Version: CSS3
JavaScript syntax: object.style.borderImageSource="url(border.png)" Try it

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
border-image-source 15.0 11.0 15.0 6.0 15.0

CSS Syntax

border-image-source: none|image|initial|inherit;

Property Values

Value Description
none No image will be used
image The path to the image to be used as a border
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

Related Pages

CSS3 tutorial: CSS3 Border Images

CSS Reference: border-image property

CSS Reference: border-image-outset property

CSS Reference: border-image-repeat property

CSS Reference: border-image-slice property

CSS Reference: border-image-width property

HTML DOM reference: borderImageSource property



COLOR PICKER

colorpicker

SHARE THIS PAGE






Search w3schools.com:

Translate w3schools.com: