css 弹性布局

		什么是弹性布局?
			flex布局,是H5新出的布局方式,主要代替传统float浮动布局。
			注意:布局要给父元素设置,子元素按照布局方式排列,他会使块级元素不独占一行。
			特点:当没有给弹性布局设置换行时,子元素不会自动换行会在一行显示。
		display: flex;	设置弹性布局
		flex-direction:设置布局方向 ;
			row;默认的从左至右的顺序排列的,代替左浮动/行内块元素。
			row-reverse:按照从右至左的方向排列,代替右浮动。
			column:按照从上至下的顺序排列,类似于正常文档流布局。
			column-reverse:按照从下至上的顺序排列。
		justify-content: 设置布局对齐方式;
			center:居中对齐方式。
			flex-start:从开始的位置对齐,头部对齐。
			flex-end:从结束的位置对齐,尾部对齐。
			space-around:子元素之间的距离等分。并左右两边留白,留白的距离是元素之间距离的一半。
			space-between:子元素之间的距离等分,左右两边不留白。
		flex-wrap: wrap;	设置换行
			从超出父元素宽度的子元素开始换行,谁超出父元素从谁开始换行。

你可能感兴趣的:(web,弹性布局)