box-decoration-breakSvojstvo omogućuje kontrolu koliko kutija ukrasi su izvučeni preko fragmentima „slomljena” elementa. Element se može razbiti na fragmente na kraju retka, preko stupaca ili na prijelomu stranice.
.module ( box-decoration-break: clone; )Kutiji dekoracija svojstva pod kontrolom box-decoration-breaksu: background(i njegovi pod-svojstva), border, border-radius, border-image, box-shadow, margin, i padding.
Vrijednosti
slice: početna vrijednost. Dekoracije kutija odnose se na element u cjelini i lome se na rubovima fragmenata elementa.clone: ukrasi se primjenjuju na svaki fragment elementa kao da su fragmenti neprekinuti, pojedinačni elementi. Granice obavijaju četiri ruba svakog fragmenta elementa, a pozadine se u potpunosti precrtavaju za svaki fragment.
Upotreba
box-decoration-break može pomoći u održavanju dosljednog dizajna među ulomcima slomljenog elementa.
Na ovom primjeru slike odlomak s narančastom obrubom i gornjom marginom od 1em prelomljen je u dva stupca. Gornji odlomak ima početnu box-decoration-breakvrijednost slice. Donji odlomak ima clonevrijednost.
Članak i demo o tome.
Demo
box-decoration-breakObjekt ima ograničenu podršku preglednika. Ova demonstracija najbolje radi u Firefoxu 37+, gdje box-decoration-breakje u potpunosti podržana.
Pogledajte olovku 1074b03653ffb32b88a6f88823c3de34 tvrtke CSS-Tricks (@ css-tricks) na CodePenu.
Podrška preglednika
U vrijeme pisanja ovog članka samo Firefox u potpunosti podržava box-decoration-break. Preglednici Webkit i Opera djelomično podržavaju box-decoration-breakugrađene elemente preko prijeloma redaka, ali ne i prijelome stupaca ili stranica.
| Krom | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 31 * | 7 * | 37 | 29 * | Nijedna | 4,4 * | 7,1 * |
* djelomična podrška s -webkitprefiksom.