box-decoration-breakProprietatea vă permite să controlați modul în care decoratiuni cutie sunt trase peste fragmente ale unui element de „rupt“. Un element se poate sparge în fragmente la sfârșitul unei linii, peste coloane sau la pauzele de pagină.
.module ( box-decoration-break: clone; )Caseta de proprietăți decorare controlate de box-decoration-breaksunt: background(și sub-proprietăți), border, border-radius, border-image, box-shadow, margin, și padding.
Valori
slice: valoarea inițială. Decorațiunile cutiei se aplică elementului ca întreg și se rup la marginile fragmentelor elementului.clone: decorațiunile se aplică fiecărui fragment al elementului ca și cum fragmentele ar fi elemente individuale neîntrerupte. Bordurile înfășoară cele patru margini ale fiecărui fragment al elementului, iar fundalurile sunt redesenate integral pentru fiecare fragment.
Utilizare
box-decoration-break poate ajuta la menținerea unui design consistent între fragmentele unui element rupt.
În această imagine de exemplu, un paragraf cu o margine portocalie și o marjă superioară de 1em este împărțit în două coloane. Paragraful superior are box-decoration-breakvaloarea inițială de slice. Paragraful de jos are clonevaloarea.
Articolul și demonstrația acestuia.
Demo
box-decoration-breakProprietatea are suport limitat de browser. Această demonstrație funcționează cel mai bine în Firefox 37+, unde box-decoration-breakeste complet acceptată.
Vezi Pen 1074b03653ffb32b88a6f88823c3de34 de CSS-Tricks (@ css-tricks) pe CodePen.
Suport pentru browser
În momentul redactării acestui articol, numai Firefox acceptă pe deplin box-decoration-break. Browserele Webkit și Opera acceptă parțial box-decoration-breakelementele în linie între pauzele de linie, dar nu și între pauzele de coloană sau de pagină.
| Crom | Safari | Firefox | Operă | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 31 * | 7 * | 37 | 29 * | Nici unul | 4.4 * | 7.1 * |
* suport parțial cu -webkitprefix.