align-content属性起作用的条件:

  1. 对父元素设置自由盒属性display:flex;
  2. 并且设置排列方式为横向排列flex-direction:row;
  3. 设置换行,flex-wrap:wrap;

scss中的align-content属性

1,align-content:stretch;

scss中的align-content属性

2, align-content:flex-start;

scss中的align-content属性

3,    align-content:flex-end;

scss中的align-content属性

4,    align-content:center;

scss中的align-content属性

5,    align-content:space-between;

scss中的align-content属性

6,    align-content:space-around;

scss中的align-content属性

参考:https://www.jianshu.com/p/63c17bac0814

相关文章: