CSS参考手册
片段模块 | Fragmentation
容器中途分割 | break-inside
break-inside CSS属性定义页，列或区域断裂的行为方式产生的箱内。如果没有生成的框，则忽略该属性。
/* Keyword values */
break-inside: auto;
break-inside: avoid;
break-inside: avoid-page;
break-inside: avoid-column;
break-inside: avoid-region;
/* Global values */
break-inside: inherit;
break-inside: initial;
break-inside: unset;每个可能的断点（换句话说，每个元素边界）都受到三个属性的影响：break-after前一个元素的break-before值，下一个元素的break-inside值以及包含元素的值。
若要确定是否必须中断，请应用下列规则：
- 如果这三项关注值是被迫中断值（
always，left，right，page，column，或region），它具有优先权。如果多于一个是这样的中断，则使用流中最近出现的元素的值。因此，break-before优先于break-after，而break-inside优先于该值。
- 如果任何三种有关值是避免中断值（
avoid，avoid-page，avoid-region，avoid-column），则在该点处无事发生。
一旦施加了强制中断，如果需要，可以添加软中断，而不是在相应的避免值中解析的元素边界上。
初始值 |
auto |
|---|---|
应用于 |
block-level elements |
是否继承 |
no |
适用媒体 |
paged |
计算值 |
as specified |
动画类型 |
discrete |
规范顺序 |
the unique non-ambiguous order defined by the formal grammar |
语法
该break-inside属性被指定为下面列表中的一个关键字值。
取值
auto允许（但不强制）在原理框中插入任何中断（页面，列或区域）。
avoid避免在主体框中插入任何中断（页面，列或区域）。
avoid-page避免原理框中的任何分页符。
avoid-column避免原理框中的任何列中断。
avoid-region避免原理框中的任何区域中断。
形式语法
auto | avoid | avoid-page | avoid-column | avoid-region规范
Specification |
Status |
Comment |
|---|---|---|
CSS Fragmentation Module Level 3The definition of 'break-inside' in that specification. |
Candidate Recommendation |
No change. |
CSS Regions Module Level 1The definition of 'break-inside' in that specification. |
Working Draft |
Extends the property to handle region breaks. |
CSS Multi-column Layout ModuleThe definition of 'break-inside' in that specification. |
Candidate Recommendation |
Initial definition. |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
|---|---|---|---|---|---|---|
Basic support |
No support1 |
(Yes)2 |
No support |
10 |
11.10 - 12.1 |
No support1 |
column, avoid-column |
No support1 |
No support |
No support |
10 |
11.10 - 12.1 |
No support1 |
recto, verso |
No support |
No support |
No support |
No support |
No support |
No support |
region, avoid-region |
No support1 |
No support |
No support |
No support |
No support |
No support1 |
Feature |
Android |
Edge |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
|---|---|---|---|---|---|---|
Basic support |
No support1 |
(Yes)2 |
No support |
? |
? |
No support1 |
column, avoid-column |
No support1 |
No support |
No support |
? |
? |
No support1 |
recto, verso |
No support |
No support |
No support |
No support |
No support |
No support |
region, avoid-region |
No support1 |
No support |
No support |
No support |
No support |
No support1 |
片段模块 | Fragmentation相关
层叠样式表（ Cascading Style Sheets ）是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
加载中,请稍侯......