orphans

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Thuộc tính CSS orphans đặt số dòng tối thiểu trong một container khối phải được hiển thị ở cuối một trang, vùng hoặc cột.

Trong nghề in ấn, orphan (dòng mồ côi đầu) là dòng đầu tiên của một đoạn văn xuất hiện một mình ở cuối trang. (Đoạn văn tiếp tục ở trang kế tiếp.)

Cú pháp

css
/* Giá trị <integer> */
orphans: 2;
orphans: 3;

/* Giá trị toàn cục */
orphans: inherit;
orphans: initial;
orphans: revert;
orphans: revert-layer;
orphans: unset;

Giá trị

<integer>

Số dòng tối thiểu có thể ở lại một mình ở cuối đoạn trước khi ngắt phân mảnh. Giá trị phải dương.

Định nghĩa hình thức

Initial value2
Applies toblock container elements
Inheritedyes
Computed valueas specified
Animation typeby computed value type

Cú pháp hình thức

orphans = 
<integer [1,∞]>

<integer> =
<number-token>

Ví dụ

Đặt kích thước orphan tối thiểu là ba dòng

HTML

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 orphans work.
  </p>
  <p>
    This is the third paragraph. It has a little bit more text than the first
    one.
  </p>
</div>

CSS

css
div {
  background-color: #8cffa0;
  height: 150px;
  columns: 3;
  orphans: 3;
}

p {
  background-color: #8ca0ff;
}

p:first-child {
  margin-top: 0;
}

Kết quả

Đặc tả

Specification
CSS Fragmentation Module Level 3
# widows-orphans

Tương thích trình duyệt

Xem thêm