此属性允许您将图像添加为元素周围的边框。默认值为 none 100% 1 0 stretch。
border-image 是以下内容的简写属性:
可能的值
- border-image-source - 它指定要设置为边框的图像的路径。
- border-image-slice - 它指定如何对要设置为边框的图像进行切片。
- border-image-width - 它指定要设置为边框的图像的宽度。
- border-image-outset - 它指定边框图像区域超出边框的程度。
- border-image-repeat − 它指定是否重复图像以填充边框。
- initial − 它设置属性的默认值。
- inherit - 它从父元素继承属性。
适用于
所有 HTML 元素。
DOM 语法
object.style.borderImage="url(image) 30 round"
例
以下示例显示了此属性的效果 -
<html>
<head>
<style>
.box {
border: 10px solid transparent;
padding: 15px;
border-image: url(images/border.png) 30 stretch;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>