弹性布局

/*  开启弹性布局的换行 */
flex-wrap: wrap;

 

/* 变为多行了 无法使用 align-items 进行位置设置 
   align-content 在多行的时候 设置属性 跟 justify-content 一模一样
   如果只有 一行时 无法生效
*/

 

/*  调整元素 在主轴上的 排布方式
   flex-end 到主轴的末尾
   flex-start 默认值
   center 居中
   space-between 左右靠边,中间间隙 相等排布
   space-around 左右 间隙相等
 */

 

/* 设置副轴的 对其方式
   如果 只有一行 设置 元素 在副轴上的对其方式
   flex-start
   flex-end
   center
   stretch：拉伸，是默认值，在不设置高的时候出现效果，如果设置了高就没有用了
 */
/*align-items: stretch;*/

Align-self （纵轴）设置子元素