widows
CSS
property sets the minimum number of lines in a block container that must be shown at the
top
of a
page
, region, or
column
.
/* <integer> values */ widows: 2; widows: 3; /* Global values */ widows: inherit; widows: initial; widows: unset;
In typography, a widow is the last line of a paragraph that appears alone at the top of a page. (The paragraph is continued from a prior page.)
<integer>
The minimum number of lines that can stay by themselves at the top of a new fragment after a fragmentation break. The value must be positive.
| 初始值 |
2
|
|---|---|
| 适用于 | block container elements |
| 继承 | yes |
| 计算值 | 如指定 |
| 动画类型 | discrete |
<integer>
<div> <p>This is the first paragraph containing some text.</p> <p>This is the second paragraph containing some more text than the first one. It is used to demonstrate how widows work.</p> <p>This is the third paragraph. It has a little bit more text than the first one.</p> </div>
div {
background-color: #8cffa0;
columns: 3;
widows: 2;
}
p {
background-color: #8ca0ff;
}
p:first-child {
margin-top: 0;
}
| 规范 | 状态 | 注释 |
|---|---|---|
|
CSS Fragmentation Module Level 3
The definition of 'widows' in that specification. |
候选推荐 |
Extends
widows
to apply to any type of fragment, including pages, regions, or columns.
|
|
CSS Multi-column Layout Module
The definition of 'widows' in that specification. |
工作草案 |
Recommendations to consider
widows
in relation to columns.
|
|
CSS Level 2 (Revision 1)
The definition of 'widows' in that specification. |
推荐 | 初始定义。 |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
widows
|
Chrome 完整支持 25 | Edge 完整支持 12 | Firefox 不支持 No | IE 完整支持 8 | Opera 完整支持 9.2 | Safari 完整支持 1.3 | WebView Android 完整支持 ≤37 | Chrome Android 完整支持 25 | Firefox Android 不支持 No | Opera Android 完整支持 14 | Safari iOS 完整支持 1 | Samsung Internet Android 完整支持 1.5 |
完整支持
不支持