Definición de .box-decoration-break utilizado en CSS
La propiedad .box-decoration-break le permite controlar cómo se dibujan las decoraciones de cajas a través de los fragmentos de un elemento «roto». Un elemento puede entrar en fragmentos al final de una línea, a través de columnas o en los descansos de la página.
Ejemplo de empleo de box-decoration-break
Si te gustaría emplear esta propiedad de CSS en tu hoja styles.css, hazlo de esta forma:
.module {
box-decoration-break: clone;
}Otro ejemplo más avanzado de .box-decoration-break es el siguiente de CODEPEN:
Sintaxis de .box-decoration-break en CSS
box-decoration-break: slice|clone|initial|inherit|unset;Valores
| Valor | Descripción |
|---|---|
| rodaja | Defecto. Las decoraciones de caja se aplican al elemento como un todo y se rompen en los bordes de los fragmentos del elemento. |
| clon | Las decoraciones de caja se aplican a cada fragmento del elemento como si los fragmentos fueran elementos individuales. Los bordes envuelven los cuatro bordes de cada fragmento del elemento y los fondos se vuelven a dibujar por completo para cada fragmento |
| inicial | Establece esta propiedad en su valor predeterminado. |
| heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .box-decoration-break
Los números de la tabla especifican la primera versión del navegador que es completamente compatible con la propiedad.
Los números seguidos de -webkit- especifican la primera versión que funcionó con un prefijo.
| Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| box-shadow | 10.0 4.0 -webkit- | 9.0 | 4.0 3.5 -moz- | 5.1 3.1 -webkit- | 10.5 |
