orphans
orphans CSS 属性指定块容器在页、区域或列的底部显示的最小行数。
/* <integer> values */
orphans: 2;
orphans: 3;
/* Global values */
orphans: inherit;
orphans: initial;
orphans: unset;显示时，orphan出现在页面底部的段落的第一行。
初始值 | 2 |
|---|---|
应用于 | block container elements |
是否继承 | yes |
适用的媒体 | visual |
计算值 | as specified |
动画类型 | discrete |
规范顺序 | per grammar |
语法
取值
<integer>在分段之前可以留在片段底部的最小行数。取值必须是正的。
形式语法
<integer>例
HTML
<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>CSS
div {
background-color: #8cffa0;
height: 150px;
columns: 3;
orphans: 3;
}
p {
background-color: #8ca0ff;
}
p:first-child {
margin-top: 0;
}结果
规范
Specification | Status | Comment |
|---|---|---|
CSS Fragmentation Module Level 3The definition of 'orphans' in that specification. | Candidate Recommendation | Extends orphans to apply to any type of fragment, including pages, regions, or columns. |
CSS Multi-column Layout ModuleThe definition of 'orphans' in that specification. | Candidate Recommendation | Recommendations to consider orphans in relation to columns. |
CSS Level 2 (Revision 1)The definition of 'orphans' in that specification. | Recommendation | Initial definition. |
浏览器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
Basic support | 25.0 | (Yes) | No support | 8 | 9.2 | No support |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
Basic support | 25.0 | (Yes) | No support | ? | ? | No support |
本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com
