CSS 属性:border-image-outset
边框图像的边缘溢出。边框图像可以超出边框区域边缘的程度。
通过从边框的顶部、右侧、底部和左侧边缘建立偏移量来设置,将绘制区域向外推。任何超出标准边框区域的边框部分都不会影响周围的任何内容——它不会将另一个框从其初始位置推开,不会触发滚动,也不会响应鼠标事件。
可能的值
| 值 | 描述 | 示例 |
|---|---|---|
| [length] | 顶部、右侧、底部和左侧偏移量。不应为负数。 | 10px |
| [数字] | 顶部、右侧、底部和左侧偏移量。计算出的边框宽度的倍数。不应为负数。 | 1.2 |
| [值] [值] | 第一个值为顶部和底部偏移量。第二个值为右侧和左侧偏移量。 | 5px 10px |
| [值] [值] [值] | 第一个值为顶部偏移量。第二个值为右侧和左侧偏移量。第三个值为底部偏移量。 | 1.2 0.8 0.5 |
| [值] [值] [值] [值] | 第一个值为顶部偏移量。第二个值为右侧偏移量。第三个值为底部偏移量。第四个值为左侧偏移量。 | 5px 10px 15px 20px |
inherit | ||
initial | ||
unset | ||
示例
aside {
border: 10px solid fuchsia;
border-image-source: url("fluffy.png");
border-image-outset: 0.5;
}
/* - Sets "fluffy.png" as the border image on a 10-pixel wide border with a solid fuchsia-colored fallback.
- The border is pushed outwards, overhanging the border edge, by 50% of the border width. */
