border-image-source property

Specifies the location of the image to be used for the border.

CSS Backgrounds and Borders Module Level 3, Section 6IE11

Syntax

border-image-source: none | <image>

Property values

One of the following values:

none

Initial value. This value adds an image layer but draws nothing.

image

Location of the border image, in the form "url(sUrl)" where sUrl is an absolute or relative URL.

CSS information

Applies ToAll elements
Mediavisual
Inheritedno
Initial Valuenone

Standards information

Remarks

If the value is none, or if the image is not found, then Internet Explorer will fall back to the computed value of border-style.

Examples

In the CSS below, the path to a custom image, "border.png", is specified for border-image-source. After setting border-image-slice to 30 pixels, the element will look like the following image.

An HTML element with an image defined for border-image-source.


#box {
   border: solid 15px;
   border-image-source: url("border.png");
   border-image-slice: 30;
}

See also

CSSStyleDeclaration
border-image
border-image-outset
border-image-repeat
border-image-slice
border-image-width

 

 

Show:
© 2014 Microsoft