border-image屬性把邊框的背景設定為。
詳細解析可以檢視該**：
一、瀏覽器對它的支援
firefox3.5-firefox15 需要加-moz-字首
firefox15以上 同樣支援-moz-字首的css**，但是必須在css**中加入border-style:solid;否則不會看到效果。
chrome1.1.x以上 需要加字首-webkit-
safari3.1以上 需要加字首-webkit-
opera瀏覽器 需要加字首-o-
較新版本的chrome,firefox及webkit核心的opera 支援w3標準，可以不加字首。
ie瀏覽器 支援效果不好，ie11可以支援。
二、border-image的引數
border-image-source:url('') 的路徑
border-image-slice 的裁切方式，4個引數可以是畫素值，也可以是百分比。順序為上，右，下，左。
border-image-width 邊框的寬度， 順序為上，右，下，左。
border-image-outset 邊框偏移基準位置的畫素值，預設為0，
border-image-repeat 裁切後的填充方式，可選stretch/repeat/round,分別為拉伸，重複，平鋪，預設值為stretch,順序為：上下，左右。
三、對引數進行解析
border-image-slice 的裁切方式，4個引數可以是畫素值，也可以是百分比。順序為上，右，下，左。
border-image-slice：33% 33% 33% 33%或則border-image-slice：33%。
把一張進行切割，按照上面的百分比來切割。通過上面的四個百分比可以把一張切割成9部分，然後把其中外部的八部分按照填充方式進行填充到邊框上的相應位置。如果邊框有一定的寬度，那麼四條邊和與之包含的內容的組合也是乙個九宮格。
border-image-outset：50px
表示填充的外部邊緣距離元素邊框為50px.如果邊框的寬度小於border-image-outset的值，那麼元素與影象填充之間會有（border-image-outset的值減去邊框寬度）大的間隙。
border-image-repeat：把按照上面裁切的方式裁切之後，每部分的小就要按照對應的邊框區域填充。在填充時，的四個角的不會改變。其餘的會隨著
border-image-repeat設定的填充方式來改變。
border image屬性分析
沒用border image之前，覺得css的屬性基本夠用，border image完全是將簡單的工作複雜化，當學習完該屬性以後，發現該屬性的運用能夠大大節省編碼時間和效率，總結一下，大致適用於以下兩個場景 元素邊框不規則的情況。這時候，就需要用設計圖作為邊框背景，border image與back...
border image屬性深入剖析
border image簡寫 border image source slice width outset repeat 不簡寫，單獨設定屬性，屬性如下 屬性屬性值 作用border image source xx數字 相應的border width倍數 xxpx xx fill 保留中心部分 邊界...
詳解css樣式中的border image
border image source 屬性設程式設計客棧置邊框的的路徑 none 程式設計客棧gt div border image slice 屬性邊框向內偏移 1,4 fill div border image width 屬性設定邊框的寬度 auto 1,4 div border image...