页面历史

...

flex 布局下的垂直对齐方式

top|middle|bottom

align="top"

此取值会让子元素 Col 在容器顶部对齐。

align="middle"

该取值会使子元素 Col 在容器垂直居中对齐。

align="bottom"

这个取值会让子元素 Col 在容器底部对齐。

栅格间隔

栅格间隔，可以写成像素值或支持响应式的对象写法来设置水平间隔 { xs: 8, sm: 16, md: 24}。或者使用数组形式同时设置 [水平间距, 垂直间距]

...

start|end|center|space_around|space_between

justify="start"

子元素 Col 会从容器的起始位置开始排列，也就是左对齐（在从左到右的布局中）。

justify="end"

子元素 Col 会排列在容器的末尾位置，即右对齐（在从左到右的布局中）。

justify="center"

子元素 Col 会在容器中水平居中排列。

justify="space-around"

子元素 Col 会在容器中均匀分布，每个元素两侧的间隔相等。

justify="space-between"

子元素 Col 会在容器中均匀分布，第一个元素靠容器起始位置，最后一个元素靠容器末尾位置，中间元素之间间隔相等。

布局模式

flex：Flex 布局是基于 24 栅格来定义每一个『盒子』的宽度，但不拘泥于栅格。