CSS3中border-image属性的最简单的使用方法

border-image属性的最简单的使用方法如下：

border-image:url(图像文件的路径) A B C D

A B C D 4个参数表示当浏览器自动把边框使用到的图像进行分割时的上边距、右边距、下边距、左边距。

border-image：url(borderimage.png) 18 18 18 18 分割如下图：



图像被分割成9部分。

被分割为9部分的图像名称

border-top-left-image	border-top-image	border-top-right-image
border-left-image		border-right-image
border-bottom-left-image	border-bottom-image	border-bottom-right-image

具体显示的时候，border-top-left-image、border-top-right-image、border-bottom-left-image、border-bottom-right-image这4个部分是没有任何展示效果的，不会平铺、不会重复、也不会拉伸，类似于视觉中的盲点。
对于border-top-image、border-right-image、border-bottom-image、border-left-image这4个部分，浏览器分别作为上边框使使用的图像、右边框使用的图像、下边框使用的图像、左边框使用的图像进行显示，必要时可以将这4个部分图像进行平铺或拉伸。

使用border-image属性来指定边框宽度：

border-image:url(图像文件的路径)  A B C D/border-width

例如：border-image:url(borderimage.png) 18/5px 18 18 18/10px;