CSS 属性:border-image-width
边框图片的绘制区域。在边框内绘制图片的宽度。
通过从边框的顶部、右侧、底部和左侧边缘设置内偏移来确定。如果边框图片的宽度大于(由 border-width 设置的)边框本身的宽度,则边框图片将溢出边框边界,渗入框的内边距和内容区域。
可能的值
| 值 | 描述 | 示例 |
|---|---|---|
| [length] | 顶部、右侧、底部和左侧偏移量。不应为负值。 | 10px |
| [percentage] | 顶部、右侧、底部和左侧偏移量。相对于边框图片区域计算。不应为负值。 | 25% |
| [数字] | 顶部、右侧、底部和左侧偏移量。是计算出的边框宽度的倍数。不应为负值。 | 1.2 |
auto | 顶部、右侧、底部和左侧偏移量。相当于对应 border-image-slice 的宽度。如果此值不适用,则相当于边框宽度。 | |
| [值] [值] | 第一个值为顶部和底部偏移量。第二个值为右侧和左侧偏移量。 | 25% 10% |
| [值] [值] [值] | 第一个值为顶部偏移量。第二个值为右侧和左侧偏移量。第三个值为底部偏移量。 | 1.2 0.8 0.5 |
| [值] [值] [值] [值] | 第一个值为顶部偏移量。第二个值为右侧偏移量。第三个值为底部偏移量。第四个值为左侧偏移量。 | 5px 10px 15px 20px |
inherit | ||
示例
aside {
border: 10px solid fuchsia;
border-image-source: url("fluffy.png");
border-image-width: 5px;
}
/* - Sets "fluffy.png" as the border image on a 10-pixel wide border with a solid fuchsia-colored fallback.
- The border image is painted in the outer 5 pixels of the border area. */
