Specify an image as the border around a <div> element:
document.getElementById("myDIV").style.borderImage = "url(border.png) 30 30 round";
Try it Yourself »
The borderImage property is a shorthand property for setting the borderImageSource, borderImageSlice, borderImageWidth, borderImageOutset and borderImageRepeat properties.
Omitted values are set to their default values.
The numbers in the table specify the first browser version that fully supports the property.
Property | |||||
---|---|---|---|---|---|
borderImage | 16.0 | 11.0 | 15.0 | 6.0 | 15.0 |
Return the borderImage property:
object.style.borderImage
Set the borderImage property:
object.style.borderImage
= "source slice width outset repeat|initial|inherit"
Value | Description |
---|---|
borderImageSource | The path to the image to be used as a border |
borderImageSlice | The inward offsets of the image-border |
borderImageWidth | The widths of the image-border |
borderImageOutset | The amount by which the border image area extends beyond the border box |
borderImageRepeat | Whether the image-border should be repeated, rounded or stretched |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Default Value: | none 100% 1 0 stretch |
---|---|
Return Value: | A String, representing the border-image property of an element |
CSS Version | CSS3 |
CSS reference: border-image property
截取页面反馈部分,让我们更快修复内容!也可以直接跳过填写反馈内容!