編程教程CSS3border-image-slice屬性
實例
指定圖像的邊界向內偏移：
div
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}
瀏覽器支持
表格中的數字表示支持該屬性的第一個瀏覽器版本號。
| Property | |||||
|---|---|---|---|---|---|
| border-image-slice | 15.0 | 11.0 | 15.0 | 6.0 | 15.0 |
屬性定義及使用說明
border-image -slice屬性指定圖像的邊界向內偏移。
| 默認值: | 100% |
|---|---|
| 繼承: | no |
| 版本: | CSS3 |
| JavaScript 語法: | object.style.borderImageSlice="50% 50%" |
語法
border-image-slice:number%fill;
注意:此屬性指定頂部，右，底部，左邊緣的圖像向內偏移，分為九個區域：四個角，四邊和中間。圖像中間部分將被丟棄（完全透明的處理），除非填寫關鍵字。如果省略第四個數字/百分比，它和第二個相同的。如果也省略了第三個，它和第一個是相同的。如果也省略了第二個，它和第一個是相同的。
| 值 | 說明 |
|---|---|
| number | 數字表示圖像的像素（位圖圖像）或向量的坐標（如果圖像是矢量圖像） |
| % | 百分比圖像的大小是相對的：水平偏移圖像的寬度，垂直偏移圖像的高度 |
| fill | 保留圖像的中間部分 |