#linear-weight

#介绍

子元件在线性布局主轴方向上的权重。线性布局的权重概念类似于弹性布局的 flex-grow。对于有设 linear-weight 子元件的线性容器：

• 首先会计算所有 linear-weight: 0 的子元件，并计算这些子元件占用主轴方向上的尺寸。
• 其余的 linear-weight 非 0 的子元件，将按照其 linear-weight 分配剩余的（线性容器减去所有的 linear-weight: 0 的子元件的主轴大小）主轴方向上的尺寸。具体来说，linear-weight 非 0 子元件尺寸 = 子元件对应的 linear-weight ÷ 所有子元件 linear-weight 之和 ✖️ 剩余的主轴方向上的尺寸

#使用示例

css-apisrc/linear-weight/App.tsx

Code

预览

#语法

/* <number> 值 */
linear-weight: 3;
linear-weight: 5;

#取值

• <number>

  负值无效，默认值为 0。当线性布局某子元件 linear-weight 取 0 时，该子元件的布局将不受 linear-weight 的影响。

#形式定义

#形式语法

linear-weight = <number>

#与 Web 的区别

• Web 无该样式。

#兼容性

#常见问题

• 不支持同时使用固定值和 weight，如果有 weight，自动忽略固定值（性能优先）。