box-flex-group
非标准：此特性未标准化。我们不建议在生产环境中使用非标准特性，因为它们浏览器支持有限，并且可能会更改或被移除。但是，在没有标准选项的特定情况下，它们可以是合适的替代方案。
已弃用：此特性不再推荐。虽然某些浏览器可能仍然支持它，但它可能已经从相关的网络标准中删除，可能正在删除过程中，或者可能仅为兼容性目的而保留。请避免使用它，如果可能，请更新现有代码；请参阅本页底部的兼容性表格以指导您的决策。请注意，此特性可能随时停止工作。
警告：这是原始 CSS 弹性盒布局模块草案的一个属性。它已被规范取代。请参阅弹性盒，了解当前标准的信息。
box-flex-group 是一个 CSS 属性，它将弹性盒（flexbox）的子元素分配到一个弹性组中。
对于分配到弹性组的弹性元素，第一个弹性组是 1，更高的值指定后续的弹性组。初始值是 1。在分配盒子的额外空间时，浏览器首先考虑第一个弹性组中的所有元素。该组中的每个元素根据其弹性与同一弹性组中其他元素的弹性的比率获得额外空间。如果组中所有弹性子元素的空间都已增加到最大，则对下一个弹性组中的子元素重复此过程，使用上一个弹性组剩余的任何空间。一旦没有更多的弹性组，并且仍有剩余空间，额外空间将根据 box-pack 属性在包含框内分配。
如果在计算子元素的首选空间后盒子会溢出，那么将以类似于添加额外空间的方式从弹性元素中移除空间。每个弹性组依次检查，并根据每个元素的弹性比率移除空间。元素不会缩小到其最小宽度以下。
语法
/* <integer> values */
box-flex-group: 1;
box-flex-group: 5;
/* Global values */
box-flex-group: inherit;
box-flex-group: initial;
box-flex-group: unset;
box-flex-group 属性指定为任何正 <integer>。
正式定义
正式语法
box-flex-group =
<integer>
示例
基本用法示例
在最初的弹性盒规范中，box-flex-group 可用于将弹性子元素分配到不同的组中，以分配弹性空间
article:nth-child(1) {
-webkit-box-flex-group: 1;
}
article:nth-child(2) {
-webkit-box-flex-group: 2;
}
这仅在基于 WebKit 的浏览器中带有前缀得到了支持，并且在规范的后续版本中，此功能没有等效项。相反，弹性容器内空间的分配现在通过 flex-basis、flex-grow 和 flex-shrink 来处理。
规范
不属于任何标准。
浏览器兼容性
加载中…