CSS 參考手冊(cè)

CSS @規(guī)則(RULES)

CSS 屬性大全

CSS3 border-image-repeat 屬性 CSS3 border-image 屬性

CSS3 border-image-outset 屬性使用方法及示例

該border-image-outsetCSS屬性指定由邊界圖像區(qū)域超出邊框盒的量。

下表為此屬性的用法說明和版本歷史記錄，以及該屬性在javascript腳本中的使用語法。

默認(rèn)值：	0
適用于：	該屬性能被應(yīng)用于任何元素，但當(dāng)表格元素（如 tr,th,td ）的border-collapse屬性值為collapse時(shí)border-image-outset屬性無效。它也適用于::first-letter。
繼承：	沒有
可動(dòng)畫制作：	否。請(qǐng)參見動(dòng)畫屬性。
版本：	CSS3的新功能
JavaScript語法：	object.style.borderImageOutset="20 20"

border-image-outset的使用語法

該屬性的語法如下：

 border-image-outset: 	length | number | initial | inherit

下面的示例演示了如何使用border-image-outset屬性。

示例

.box {
    width: 300px;
    height: 150px;
    border: 15px solid transparent;
    border-image-source: url("border.png");
    border-image-slice: 30;
    border-image-outset: 15px;
}

測試看看?/?

屬性值

下表描述了此屬性的值。

值	描述
length	指定邊界圖像超出邊界框的絕對(duì)距離或相對(duì)單位的距離。不允許使用負(fù)值。
number	表示邊界寬度或邊界框?qū)挾?a href="css-border-width-property.html">border-width的值的倍數(shù)。不允許使用負(fù)值。
initial	將此屬性設(shè)置為其默認(rèn)值。
inherit	如果指定，則關(guān)聯(lián)元素采用其父元素border-image-outset屬性值。

瀏覽器兼容性

border-image-outset屬性瀏覽器的兼容性，下表中的數(shù)字表示支持該屬性的瀏覽器最低版本號(hào)；所有主流瀏覽器均支持該屬性。

	Firefox 15+ Google Chrome15+ Internet Explorer 11+ Apple Safari 6+ Opera 15+

進(jìn)一步閱讀

請(qǐng)參考以下教程：CSS3 Border和CSS Border。

相關(guān)屬性：border-image，border-image-source，border-image-slice，border-image-width，border-image-repeat，border。

CSS3 border-image-repeat 屬性 CSS3 border-image 屬性