border-image-outset
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since February 2017.
Описание
The border-image-outset property describes by what amount the border image area extends beyond the border box.
Portions of the border image that are rendered outside the border box as a result of this property do not cause scrolling to be triggered. These areas also don't capture or cause mouse events to occur on behalf of the bordered element.
| Начальное значение | 0 |
|---|---|
| Применяется к | все элементы, кроме внутренних табличных элементов, когда border-collapse:collapse. Это также применяется к ::first-letter. |
| Наследуется | нет |
| Обработка значения | как указано, но с относительной длиной, конвертируемой в абсолютные длины |
| Animation type | by computed value type |
Синтаксис
/* border-image-outset: sides */
border-image-outset: 1.5;
/* border-image-outset: vertical horizontal */
border-image-outset: 1 1.2;
/* border-image-outset: top horizontal bottom */
border-image-outset: 30px 2 45px;
/* border-image-outset: top right bottom left */
border-image-outset: 7px 12px 14px 5px;
border-image-repeat: inherit;
Значения
Примечание:
When a value is specified as a unitless <number>, that value is multiplied by the corresponding computed border-width to determine the border-image-outset. Negative values are invalid.
- sides
-
Is a
<length>or a<number>of the amount by which the border image area extends beyond the border box in all four directions. - horizontal
-
Is a
<length>or a<number>of the amount by which the border image area extends beyond the border box in both horizontal directions (left and right). - vertical
-
Is a
<length>or a<number>of the amount by which the border image area extends beyond the border box in both vertical directions (top and bottom). - top
-
Is a
<length>or a<number>of the amount by which the border image area extends beyond the border box past its top edge. - bottom
-
Is a
<length>or a<number>of the amount by which the border image area extends beyond the border box past its bottom edge. - right
-
Is a
<length>or a<number>of the amount by which the border image area extends beyond the border box past its right edge. - left
-
Is a
<length>or a<number>of the amount by which the border image area extends beyond the border box past its left edge. inherit-
Is a keyword indicating that all four values are inherited from each parent elements' calculated value.
Формальный синтаксис
border-image-outset =
[ <length [0,∞]> | <number [0,∞]> ]{1,4}
Спецификации
| Specification |
|---|
| CSS Backgrounds and Borders Module Level 3 # the-border-image-outset |
Совместимость с браузерами
BCD tables only load in the browser