线性布局
如果你需要一种简单的布局方式，仅需按顺序排列子元件，并不想考虑弹性布局和网格布局的复杂特性（例如缩小和放置问题），那么 Lynx 的线性布局是个不错的选择。该布局受到 Android linear layout 启发。
此外，它还是 Lynx 的默认布局。在该布局下，你也可以使用 Web 中的对齐属性：align-items、align-self 和 justify-content。有关支持的属性，请参见参考部分。
如何构建一个线性布局？
第一步：应用 display: linear
要应用线性布局，只需在元件上设置 display: linear。
第二步：设置布局方向
与弹性布局（flexible box layout）类似，线性布局同样利用主轴（main axis）和交叉轴（cross axis）来布局。主轴是沿着线性布局子元件排列的方向延伸的轴，而交叉轴与主轴垂直。
通过在父容器中的调整 linear-direction 属性可以定义主轴方向（默认是竖直方向）。这一属性与弹性布局（flexible box layout）中的 flex-direction 相似。
第三步：沿主轴对齐子元件
使用 justify-content 属性，可以来控制子元件在主轴方向上的相对位置。以下例子中的主轴方向为竖轴。
第四步：沿交叉轴对齐子元件
可以通过容器上使用 align-items 或在子元件上使用 align-self 实现元件在交叉轴上的对齐。
在下面的例子中，交叉轴是竖直方向，容器中应用了 align-items: center，因此子元件在交叉轴方向上居中对齐。
通过将第一个子元件的 align-self 设置为 end，你可以观察到之前的 align-items 的行为被覆盖了，第一个元件现在位于容器底部。
请注意，当父元件的交叉轴尺寸（例如在 linear-direction: column 时的 width）被指定，且子元件在该方向的尺寸未设置（或为 auto）时，子元件在交叉轴上的尺寸将增长以填充父元件。
第五步：规定主轴上动态尺寸（拓展）
通过为子元件设置 linear-weight 属性，可以定义权重值。容器会根据所有子元件的权重值比例及剩余空间自动分配主轴方向上子元件的尺寸，达到动态尺寸调整的效果。
在上面的例子中，linear-weight 是一个无单位的比例值，表示每个子元件在主轴上的空间份额。三个子元件按 0.5 : 2 : 0.5 的比例分配主轴上的空间。
参考
目前，线性布局支持以下布局属性：
-
特有的 CSS 属性
-
对齐属性
-
其它属性
其它属性如
order、aspect-ratio等，在这里就不一一列举，具体属性支持可以参考 API 参考。