理解布局
Lynx 提供了：
width、height、margin、padding等属性，用于描述元件的大小。display属性及线性布局、弹性布局、网格布局、相对布局，用于对元件进行布局。- 包含
align-items、justify-content等的对齐属性，用于对齐元件。 position及left、right、top、bottom属性，用于定位元件。direction及逻辑属性，用于支持布局的国际化。
Lynx 支持的布局属性与 Web 中同名的属性在行为上表现一致。但两者设计思路存在差异：Web 的布局是以文本为主体，而 Lynx 的布局则是以元件（<view>、<text>、<image> 等）作为基本布局单位。这意味着 Lynx 的布局元件都是块级元件。
下面教程将展示如何在 Lynx 中完成元件的布局。
调整元件大小
你可以使用 width、height、max-width、min-width、max-height、min-height、margin、padding 和 border-width 描述元件大小与盒模型，这些属性支持 px、%、vh 等多种长度单位。同时 width 和 height 支持 fit-content 和 max-content 的取值，用于元件的大小根据其内容自行撑开。
在 Lynx 中，box-sizing 的默认值为 border-box，且不具备外边距折叠的表现。
布局元件
<view> 元件可以用于布局子元件，且可以通过在 <view> 元件上设置 display 属性，来控制其对子元件的布局方式。display 支持 linear、flex、grid、relative、none 五种取值。
线性布局（linear）
如果你想要简单的按顺序排列元件。则可以将 display 属性设置为 linear，使用 Lynx 的默认布局--线性布局。线性布局（受 Android Linear Layout 的启发）可以按照你声明的方向将元件按顺序排列。
弹性布局（flex）
如果需要在顺序排列元件的基础上，让子元件的大小自适应父元件的大小（如增加子元件尺寸以填满未使用的空间，收缩子元件尺寸以避免溢出），则可以将 display 属性设置为 flex，使用弹性布局。Lynx 中的弹性布局和 Web 中的功能和行为上一致。
网格布局（grid）
如果想要将多个元件同时在垂直和水平方向上交错排列，形成一个二维的布局方式，则可以将 display 属性设置为 grid，使用网格布局。网格布局是 Web 中的一种布局，可以将空间划分为二维网格，将元件放到指定的行列上。Lynx 支持其能力的子集。
相对布局（relative）
如果你希望通过元件间的相对位置关系来描述布局，则可以通过将 display 属性设置为 relative，使用相对布局。相对布局（受 Android Relative Layout 的启发）可以通过描述元件之间的位置关系（例如，一个元件位于另一个元件的左侧）来声明布局。
文字与行内布局
<view> 组件内不能直接插入文字，且 Lynx 的 display 属性不支持 inline 与 block 的取值。而 <text> 元件可以完成文字展示，以及元件的行内布局。详细参考文字排版。
对齐元件
你可以使用 align-items、align-self、justify-content、align-content、justify-items 和 justify-self 属性，对齐 <view> 中布局的元件.
位移和绝对定位
通过设置 top、left、bottom、right 属性，你可以将元件在原有位置的基础上进行位移。同时可以配合对 position 属性配置，完成对元件的绝对定位.
国际化
你可以通过 direction 属性和逻辑属性，来使你的页面同时支持从左至右书写的语言（如中文）和从右至左书写的语言（如阿拉伯文）。逻辑属性指 XX-inline-start、XX-inline-end 等一系列属性（如 inset-inline-start）。
