border-image-source

版本：CSS3

CSS属性border-image-source用于声明元素的边框图片（border-image）的资源。属性border-image-slice被用于切割资源图片的区域，然后将其动态的应用到最终的边框图片。

示例

/* no border-image, use the specified border-style */
border-image-source: none;

/* the image.jpg is used as image */
border-image-source: url(image.jpg);

/* a gradient is used as image */
border-image-source: linear-gradient(to top, red, yellow);

/* global values */
border-image-source: inherit;
border-image-source: initial;
border-image-source: unset;

浏览器支持

语法

取值

• none：无背景图片。
• ：指定图片资源。参见。
• ：使用颜色渐变来是实现效果。参见linear-gradient()。

实例

p{
	border:15pxsolid;
	padding:30px;
	width:100px;
	border-image-source:url(images/kuang.jpg);
	border-image-repeat:repeat;
	border-image-slice:26%26%;
}

效果图：

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com