樣式 borderImage 屬性
示例
指定一張圖片作為 <div> 元素的邊框
document.getElementById("myDIV").style.borderImage = "url(border.png) 30 30 round";
自己動手試一試 »
描述
borderImage 屬性是一個簡寫屬性,用於設定 borderImageSource、 borderImageSlice、 borderImageWidth、 borderImageOutset 和 borderImageRepeat 屬性。
省略的值將設定為其預設值。
瀏覽器支援
表中的數字指定了完全支援該屬性的第一個瀏覽器版本。
屬性 | |||||
---|---|---|---|---|---|
borderImage | 16.0 | 11.0 | 15.0 | 6.0 | 15.0 |
語法
返回 borderImage 屬性
object.style.borderImage
設定 borderImage 屬性
object.style.borderImage = "source slice width outset repeat|initial|inherit"
屬性值
值 | 描述 |
---|---|
borderImageSource | 用作邊框的圖片路徑 |
borderImageSlice | 圖片邊框的向內偏移量 |
borderImageWidth | 圖片邊框的寬度 |
borderImageOutset | 邊框影像區域超出邊框盒子的量 |
borderImageRepeat | 圖片邊框是重複、圓形還是拉伸 |
initial | 將此屬性設定為其預設值。閱讀關於 initial |
inherit | 從其父元素繼承此屬性。閱讀關於 inherit |
技術詳情
預設值 | none 100% 1 0 stretch |
---|---|
返回值 | 一個字串,表示元素的 border-image 屬性 |
CSS 版本 | CSS3 |
相關頁面
CSS 參考: border-image 屬性