break-after
åºçº¿
广æ³å¯ç¨
*
èª 2019å¹´1æ èµ·ï¼æ¤ç¹æ§å·²å¨ä¸»æµæµè§å¨ä¸å¾å°æ¯æï¼å¯å¨å¤§å¤æ°è®¾å¤åæµè§å¨çæ¬ä¸æ£å¸¸ä½¿ç¨ã
* æ¤ç¹æ§çæäºé¨åçæ¯æç¨åº¦å¯è½ææä¸åã
break-after CSS 屿§æè¿°å¨çæççåä¹åç页é¢ï¼åæåºå䏿è¡ä¸ºï¼æ¢å¥è¯è¯´ï¼å¦ä½ä»¥åæ¯å¦ä¸æï¼ãå¦ææ²¡æçæççåï¼åè¯¥å±æ§å°è¢«å¿½ç¥ã
/* Generic break values */
break-after: auto;
break-after: avoid;
break-after: always;
break-after: all;
/* Page break values */
break-after: avoid-page;
break-after: page;
break-after: left;
break-after: right;
break-after: recto;
break-after: verso;
/* Column break values */
break-after: avoid-column;
break-after: column;
/* Region break values */
break-after: avoid-region;
break-after: region;
/* Global values */
break-after: inherit;
break-after: initial;
break-after: unset;
æ¯ä¸ªæ½å¨çæç¹ï¼äº¦å³æ¯ä¸ªå
ç´ çè¾¹çï¼é½åå°ä¸ä¸ªå±æ§çå½±åï¼ä¸ä¸ä¸ªå
ç´ ç break-after å¼ãä¸ä¸ä¸ªå
ç´ ç break-before å¼ä»¥åå½åå
ç´ èªèº«ç break-inside å¼ã
以ä¸è§å被ç¨äºå¤æä¸ææ¯å¦å¿ è¦ï¼
- 妿ä¸è¿°ä¸ä¸ªå±æ§ä¸ï¼å¦æä»»ä½ä¸ä¸ªçå¼å±äºâ强å¶ä¸æâå¼ï¼é£ä¹è¿ä¸ªå±æ§å°è¢«ä¼å
åºç¨ï¼æ¤å¤æç§°â强å¶ä¸æâçå¼ä¸ºï¼
alwaysãleftãrightãpageãcolumnåregionãIf several of the concerned values is such a break, the one of the element that appears the latest in the flow is taken (that is thebreak-beforevalue has precedence over thebreak-aftervalue, which itself has precedence over thebreak-insidevalue). - If any of the three concerned values is an avoid break value, that is
avoid,avoid-page,avoid-region,avoid-column, no such break will be applied at that point.
Once forced breaks have been applied, soft breaks may be added if needed, but not on element boundaries that resolve in a corresponding avoid value.
| åå§å¼ | auto |
|---|---|
| éç¨å ç´ | block-level elements |
| æ¯å¦æ¯ç»§æ¿å±æ§ | å¦ |
| 计ç®å¼ | as specified |
| å¨ç»ç±»å | 离æ£å¼ |
è¯æ³
The break-after property is specified as one of the keyword values from the list below.
屿§å¼
Generic break values
auto-
Allows, but does not force, any break (page, column, or region) to be inserted right after the principal box.
avoid-
Avoids any break (page, column, or region) from being inserted right after the principal box.
always-
Forces a page break right after the principal box. The type of this break is that of the immediately-containing fragmentation context. If we are inside a multicol container then it would force a column break, inside paged media (but not inside a multicol container) a page break.
all-
Forces a page break right after the principal box. Breaking through all possible fragmentation contexts. So a break inside a multicol container, which was inside a page container would force a column and page break.
Page break values
avoid-page-
Avoids any page break right after the principal box.
page-
Forces a page break right after the principal box.
left-
Forces one or two page breaks right after the principal box, whichever will make the next page into a left page.
right-
Forces one or two page breaks right after the principal box, whichever will make the next page into a right page.
recto-
Forces one or two page breaks right after the principal box, whichever will make the next page into a recto page. (A recto page is a right page in a left-to-right spread or a left page in a right-to-left spread.)
verso-
Forces one or two page breaks right after the principal box, whichever will make the next page into a verso page. (A verso page is a left page in a left-to-right spread or a left right in a right-to-left spread.)
Column break values
avoid-column-
Avoids any column break right after the principal box.
column-
Forces a column break right after the principal box.
Region break values
avoid-region-
Avoids any region break right after the principal box.
region-
Forces a region break right after the principal box.
å½¢å¼åè¯æ³
break-after =
auto |
avoid |
always |
all |
avoid-page |
page |
left |
right |
recto |
verso |
avoid-column |
column |
avoid-region |
region
Page break aliases
For compatibility reasons, the legacy page-break-after property should be treated by browsers as an alias of break-after. This ensures that sites using page-break-after continue to work as designed. A subset of values should be aliased as follows:
| page-break-after | break-after |
|---|---|
auto |
auto |
left |
left |
right |
right |
avoid |
avoid |
always |
page |
夿³¨ï¼The always value of page-break-* was implemented by browsers as a page break, and not as a column break. Therefore the aliasing is to page, rather than the always value in the Level 4 spec.
è§è
| è§è |
|---|
| CSS Fragmentation Module Level 3 > # propdef-break-after > |