CSS3 border-image-slice 屬性
實(shí)例
規(guī)定圖像邊框的向內(nèi)偏移：
div
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}
定義和用法
border-image-slice 屬性規(guī)定圖像邊框的向內(nèi)偏移。
| 默認(rèn)值： | 100% |
|---|---|
| 繼承性： | no |
| 版本： | CSS3 |
| JavaScript 語法： | object.style.borderImageSlice="50% 50%" |
語法
border-image-slice: number|%|fill;
注釋：該屬性規(guī)定圖像的上、右、下、左側(cè)邊緣的向內(nèi)偏移，圖像被分割為九個(gè)區(qū)域：四個(gè)角、四條邊以及一個(gè)中間區(qū)域。除非使用了關(guān)鍵詞 fill，否則中間的圖像部分會(huì)被丟棄。如果省略第四個(gè)數(shù)值/百分比，則與第二個(gè)值相同。如果省略第三個(gè)值，則與第一個(gè)值相同。如果省略第二個(gè)值，則與第一個(gè)值相同。
| 值 | 描述 |
|---|---|
| number | 數(shù)字值，代表圖像中像素（如果是光柵圖像）或矢量坐標(biāo)（如果是矢量圖像）。 |
| % | 相對(duì)于圖像尺寸的百分比值：圖像的寬度影響水平偏移，高度影響垂直偏移。 |
| fill | 保留邊框圖像的中間部分。 |
相關(guān)頁面
CSS3 教程：CSS3 邊框