一、css3 新增的邊框屬性
屬性
版本
簡介
border-image
css3
設定或檢索物件的邊框使用影象來填充
border-image-source
css3
設定或檢索物件的邊框是否用影象定義樣式或影象**路徑
border-image-slice
css3
設定或檢索物件的邊框背景圖的分割方式
border-image-width
css3
設定或檢索物件的邊框厚度
border-image-outset
css3
設定或檢索物件的邊框背景圖的擴充套件
border-image-repeat
css3
設定或檢索物件的邊框影象的平鋪方式
border-radius
css3
設定或檢索物件使用圓角邊框
border-top-left-radius
css3
設定或檢索物件左上角圓角邊框
border-top-right-radius
css3
設定或檢索物件右上角圓角邊框
border-bottom-right-radius
css3
設定或檢索物件右下角圓角邊框
border-bottom-left-radius
css3
設定或檢索物件左下角圓角邊框
box-shadow
css3
設定或檢索物件陰影
box-reflect
css3
設定或檢索物件的倒影
border-image
css3中新增的邊框屬性，擴充了原盒子模型的功能，使得邊框具備背景屬性。此前，border僅僅具備寬度、顏色和風格屬性.
實現邊框背景屬性，通常使用padding和background屬性進行模擬，但是這樣就為設定盒子的背景增加了難度
語法格式：該語法為css縮寫樣式
border-image：
[border-image-source ** ]
說明：設定或檢索物件的邊框樣式使用影象路徑。
指定乙個影象用來替代border-style邊框樣式的屬性。當border-image為none或影象不可見時，將會顯示border-style所定義的邊框樣式效果。
對應的指令碼特性為borderimagesource。
取值：
[ border-image-slice分割方法 ]
說明：設定或檢索物件的邊框背景圖的分割方式。
該屬性指定從上，右，下，左方位來分隔影象，將影象分成4個角，4條邊和中間區域共9份，中間區域始終是透明的（即沒影象填充），除非加上關鍵字 fill。
對應的指令碼特性為borderimageslice。
取值：
： 用浮點數指定寬度。不允許負值。
： 用百分比指定寬度。不允許負值。
[
/ [ border-image-width邊框寬度 ]? |
說明：設定或檢索物件的邊框厚度。
該屬性用於指定使用多厚的邊框來承載被裁剪後的影象。
該屬性可省略，由外部的border-width來定義。
對應的指令碼特性為borderimagewidth。
取值：
： 用長度值指定寬度。不允許負值。
： 用百分比指定寬度。不允許負值。
： 用浮點數指定寬度。不允許負值。
auto： 如果auto值被設定，則border-image-width採用與border-image-slice相同的值。
注意:該值得大小不會累加到盒子模型之上，chrome會有3畫素的大小，其餘瀏覽器border的大小依然為0
/ [border-image-outset 擴充套件方式 ]
說明：
置或檢索物件的邊框背景圖的擴充套件。
該屬性用於指定邊框影象向外擴充套件所定義的數值，即如果值為10px，則影象在原本的基礎上往外延展10px再顯示。
對應的指令碼特性為borderimageoutset。
取值：
： 用長度值指定寬度。不允許負值。
： 用浮點數指定寬度。不允許負值。
]
[ border-image-repeat重複方式 ]
說明：設定或檢索物件的邊框影象的平鋪方式。
該屬性用於指定邊框背景圖的填充方式。可定義0-2個引數值，即水平和垂直方向。如果2個值相同，可合併成1個，表示水平和垂直方向都用相同的方式填充邊框背景圖；如果2個值都為 stretch，則可省略不寫。
對應的指令碼特性為borderimageoutset。
取值：
stretch： 指定用拉伸方式來填充邊框背景圖。
二、css3 新增屬性例項
css3邊框新屬性
通過css3，可以建立圓角邊框 border radius 向矩形新增陰影 border shadow 甚至使用 border image 來繪製邊框。圓角邊框 div 取值 由浮點數字和單位識別符號組成的長度值。不可為負值。border top left radius 由浮點數字和單位識別符號組成...
CSS3新增屬性用法整理CSS3新增屬性用法整理
css3新增屬性用法整理 css3新增屬性用法整理 1 box shadow 陰影效果 2 border color 為邊框設定多種顏色 3 border image 邊框 4 text shadow 文字陰影 5 text overflow 文字截斷 6 word wrap 自動換行 7 bord...
css3 新增屬性
background origin 背景影象顯示的原點。background clip 規定背景的繪製區域。padding box 從padding區域 含padding 開始顯示背景影象。border box 從border區域 含border 開始顯示背景影象。content box 從cont...