CSS3的border-image

標籤：number   背景圖片   ber   圖片   pre   ict   div   .com   border   

border-image:none|image-url|number|percentage|stretch,repeat,round

參數：

none：預設，無背景圖片

url:地址，可以為絕對，也可以相對

number：切割背景圖片的邊框大小一共可以有1-4個值，上，右，下，左

percentage:功能同number，只是它用的是百分比，number為數字（不用寫單位，單位為px）

stretch：展開

round：平鋪

repeat：重複邊框背景

1、邊框背景圖切割時，處於四個角的地方不動，平鋪，展開，重複只針對四邊，不包括四角。

【原始邊框背景圖】

.border-img{            width: 200px;            border: 20px solid;            -webkit-border-image: url("picture/12.png") 95 100 85 105 stretch;            border-image: url("picture/12.png") 95 100 85 105 stretch;        }
　　　　

   <div class="border-img">border-img</div>

　　

 

CSS3的border-image