8.2.3　　CSS3提供的图片边框

　　　　CSS3为图片边框提供了如下属性。

　　　　border-image：该属性的值比较复杂，应该遵守如下格式：

　　　　　　<border-image-source>　　<border-image-slice>[/<border-image-width>]?　　<border-image-repeat>

　　　　上面语法格式可以分为4个部分：

　　　　　　border-image-source：指定边框图片。该值可以是none(没有边框图片)或使用url()函数指定图片。

　　　　　　border-image-slice：该属性可以指定1~4个数值或百分比数值，这4个数值用于控制如何对图片进行切割。

　　　　　　　　　　　　　　　　　　假设指定了10 20 30 40，这4个数值分别指定切割边框图片时上边框为10像素，右边框

　　　　　　　　　　　　　　　　　　为20像素，下边框为30像素，左边框为40像素。如果只指定了一个值，那么4个边框的宽度都等于该值。

　　　　　　border-image-width：该属性用于指定图片边框的宽度。该属性值可指定1~4个长度值、数值、百分比值或auto。

　　　　　　border-image-repeat：该属性用于指定边框图片的覆盖方式，支持stretch(拉伸覆盖)、repeat(平铺覆盖)、round(取整平铺)三种

　　　　　　　　　　　　　　　　　　覆盖方式。该属性可指定两个值，分别代表横向、纵向覆盖方式。

　　　　　　代码示范：

　　　　　　　　//为该div指定图片边框，且边框宽度为27px

　　　　　　　　div{

　　　　　　　　　　border-image:url(图片路径) 27;

　　　　　　　　}

　　　　　　　　//为该div指定图片边框，且指定边框宽27px，默认是拉伸边框图片

　　　　　　　　div{

　　　　　　　　　　border-image:url(图片路径) 27/27px;

　　　　　　　　}

8.3　　补丁相关属性

　　8.3.1　　内补丁相关属性

　　　　　　内补丁相关属性有如下几个。

　　　　　　　　padding：该属性可以同时设置上、下、左、右4个边的内补丁距离。如果只为该属性设置了一个长度，则该值将作为

　　　　　　　　　　　　　　上、下、左、右4个边的内补丁距离。

　　　　　　　　padding-top：设置上边的内补丁距离。

　　　　　　　　padding-right：设置右边的内补丁距离。

　　　　　　　　padding-bottoom：设置下边的内补丁距离。

　　　　　　　　padding-left：设置左边的内补丁距离。