Característica border-image-outset en CSS

por
Característica del border-image-outset CSS

La propiedad border-image-outset CSS especifica cuánto se extenderá la imagen del marco más allá del borde exterior del marco.

Funciones border-image-outset css

Valor inicial0
Aplicado aTodos los elementos excepto los elementos de tabla interiores en el que la propiedad se establece border-collapse a collapse.
HeredableNo
MóvilNo
Valor calculadoComo se especifica, pero con longitudes relativas convertidas a longitudes absolutas.
/* border-image-outset: todo */ 
border-image-outset :  1.5 ;
/* border-image-outset: vertical horizontal */ 
border-image-outset :  1  1.2 ;
/* border-image-outset: superior horizontal inferior */ 
border-image-outset :  30px  2  45px ;
/* border-image-outset: arriba, derecha, abajo e izquierda */ 
border-image-outset :  7px  12px  14px  5px ;
/* valores globales */ 
border-image-outset :  inherit;

Ejemplos y aplicaciones

Vea la página de características border-image.

Soporte de navegadores

CaracterísticaChromeFirefoxIEÓperaSafari
Soporte básico151511156

Características generales

La propiedad se puede especificar con un valor  border-image-outset, dos valores, tres valores o cuatro valores.

  • Cuando se especifica un solo valor, se aplicará a todas las facetas del marco.
  • Cuando se especifican dos valores, el primer valor se aplicará a los marcos superior e inferior, y el segundo valor a los marcos izquierdo y derecho.
  • Cuando se especifican tres valores, el primer valor se aplicará al marco superior, el segundo valor a los marcos izquierdo y derecho y el tercer valor al marco inferior.
  • Cuando se especifican cuatro valores, los valores se aplicarán al lado superior, derecho, inferior e izquierdo, respectivamente (es decir, la rotación comienza desde el lado superior y continúa en el sentido de las agujas del reloj).

<length>

Especifica cuánto excede la imagen del marco el contorno del marco. No se permiten valores negativos.

<number>

Especifica el valor por el cual se multiplicará el valor de la propiedad para border-width determinar el valor de la propiedad border-image-outset. No se permiten valores negativos.

Estructura

border-image-outset: [ <length> | <number> ]{2,5};

Vea también

  • La página de propiedades establecido por la propiedad de acceso directo border-image: border-image-source, border-image-slice, border-image-width y border-image-repeat.
  • La página de propiedades establecido por la propiedad de acceso directo border: border-width, border-style y border-color.