多语言展示
当前在线:1231今日阅读:23今日分享:25

CSS3中的伸缩布局三

css3中的伸缩布局
工具/原料

电脑,DW软件

方法/步骤
1

伸缩布局(垂直设置,多行):align-content:flex-start;(上对齐,默认)                        flex-end;(下对齐)                        center;(中间对齐)

2

伸缩布局(垂直设置,多行):align-content:space-between;(平局分布)                        space-around;(平局分布,有两端距离,两端距离是中间距离的一半)

3

伸缩布局(垂直设置,多行):align-content:stretch;(拉伸,占满)

4

伸缩布局(垂直设置,各盒子大小不一样):align-items:flex-start;(上对齐,默认)                    flex-end;(下对齐)                    center;(中间对齐)

5

伸缩布局(垂直设置,各盒子大小不一样):align-items:baseline;(根据文字对齐)

注意事项

伸缩布局需要添加兼容前缀

推荐信息