For AI agents: the complete documentation index is available at /next/zh/llms.txt, the full documentation bundle is available at /next/zh/llms-full.txt, and this page is available as Markdown at /next/zh/api/css/properties/linear-weight-sum.md.
Lynx
  • 简体中文
  • deprecated linear-weight-sum

    Warning

    该 API 已被废弃。

    介绍

    线性布局中,子元件在父容器主轴方向上的权重和。线性布局的权重概念类似于弹性布局flex-grow

    当一个线性布局容器的 linear-weight-sum 样式为非 0 时:

    • 首先会测量所有 linear-weight:0 的子元件,并计算这些子元件占用主轴方向上的尺寸。
    • 其余的 linear-weight0 的子元件,将按照其 linear-weight 分配剩余的(线性布局容器减去所有的 linear-weight: 0 的子元件的主轴大小)主轴方向上的尺寸。为了方便计算展示,“所有子元件 linear-weight 之和”看作符号“S”
      • linear-weight-sum <= S 时:

        子元件尺寸 = 子元件对应的 linear-weight ÷ S ✖️ 剩余的主轴方向上的尺寸

      • linear-weight-sum > S 时:

        子元件尺寸 = 子元件对应的 linear-weight ÷ linear-weight-sum ✖️ 剩余的主轴方向上的尺寸

    Tip

    线性容器主轴大小必须是确定值(推荐,不然会有莫名其妙的表现);

    不支持同时使用固定值和 linear-weight,如果有 linear-weight,自动忽略固定值(性能优先);

    使用示例

    图中父元件高度 400px,第一个元件固定 100px,剩余高度 300px,第二、三个元件指定大小,根据权值分配,第二个元件高 200px,第三个元件高 100px。

    语法

    linear-weight-sum: 2;
    linear-weight-sum: 5.5;

    取值

    • <number>

      负值无效,默认值0

    形式定义

    初始值0
    适用元素线性容器
    是否支持继承
    是否支持动画

    形式语法

    linear-weight-sum = <number>

    与 Web 的区别

    • Web 无该样式。

    兼容性

    LCD tables only load in the browser

    常见问题

    • 线性容器主轴大小必须是确定值(推荐,不然会有莫名其妙的表现);

    • 不支持同时使用固定值和 linear-weight,如果有 linear-weight,自动忽略固定值(性能优先);

    除非另有说明,本项目采用知识共享署名 4.0 国际许可协议进行许可,代码示例采用 Apache License 2.0 许可协议进行许可。