Layout
用於控制元素片段應如何在多行、多欄或多頁中呈現的通用類別。
| Class | Styles |
|---|---|
box-decoration-clone | box-decoration-break: clone; |
box-decoration-slice | box-decoration-break: slice; |
使用 box-decoration-slice 和 box-decoration-clone 通用類別來控制 background、border、border-image、box-shadow、clip-path、margin 和 padding 等屬性是否應該作為一個連續片段或獨立區塊來呈現：
box-decoration-slice
box-decoration-clone
<span class="box-decoration-slice bg-linear-to-r from-indigo-600 to-pink-500 px-2 text-white ..."> Hello<br />World</span><span class="box-decoration-clone bg-linear-to-r from-indigo-600 to-pink-500 px-2 text-white ..."> Hello<br />World</span>在 box-decoration-break 通用類別前面加上像 md: 這樣的中斷點變體，讓該通用類別只在中型螢幕尺寸及以上時套用：
<div class="box-decoration-clone md:box-decoration-slice ..."> <!-- ... --></div>在變體文件中了解更多關於使用變體的資訊。