本文翻译自CSS3.info，并稍加改动，原文地址：Border-image: using images for your border。

CSS3中，另一个令人兴奋的属性是border-image。运用这个属性，你可以使用图片定义一个元素的边框。该元素由以下几个元素组成：border-image和border-corner-image。这两个元素简写为：

border-image:
border-top-image
border-right-image
border-bottom-image
border-left-image
border-corner-image:
border-top-left-image
border-top-right-image
border-bottom-left-image
border-bottom-right-image

border-image目前支持的浏览器有Firefox 3.5+、Chrome、Safari。Firefox需加前缀-moz，-Webkit内核浏览器加前缀-webkit。

例1：

border-image:url(border.png) 27 27 27 27 round round;

结果如下：

将border-image下的背景图片拉伸。

例２：

border-image: url(border.png) 27 27 27 27 stretch stretch;

结果如下：

将border-image下的背景图片平铺。

如果不幸您的浏览器不支持border-image属性，下面是显示效果的截图：

第一个例子：

第二个例子：