border-image

border-image 该属性用作给元素的边框添加背景图片。使用该属性时，会替换掉 border-style 属性所设置的边框样式。

 

语法

border-image: url("hudao.jpg") 20 20 repeat;

值

值描述
image-source 此关键词表示图片的路径
image-height 此关键词表示图片的高度
image-width 此关键词表示图片的宽度
image-repeat 此关键词表示图片是否平铺，铺满或者拉伸

例子

HTML 

<div id="red">
</div>

CSS 

#red {
     height: 200px;
     border: 2px dashed red;
     border-image: url("https://mdn.mozillademos.org/files/4127/border.png") 30;
     }

执行结果

参考

相关链接

外部链接


跳至内容顶部