Flex Box Adventure ☆ 答案

 

1.        justify-content:center;

2.         justify-content:end;

3.        justify-content:space-between;

4.        justify-content:space-around;

5.        justify-content:space-evenly;

6.        align-items:center;

7.        align-items:flex-end;

8.        justify-content:center;
           align-items:center;

9.        align-items:flex-end;
           justify-content:space-between;

10.        flex-direction:column;

11.        flex-direction:row-reverse;

12.        flex-direction:column; justify-content:flex-end;  和 justify-content:flex-end; flex-direction:column;是一样的

13.        flex-direction:row-reverse;
             justify-content:center;
             align-items:center;

14.        order:2;

15.        align-self:center;

16.        align-self:flex-end; order:1;      和  order:1; align-self:flex-end;  是一样的

17.       flex-direction:column-reverse;
            align-items:center;
            justify-content:flex-end;              这三行代码先后顺序调换结果都一样，都是正确答案。

 18.        order:2;
              align-self:center;

19.        flex-wrap:wrap;

20.        align-content:center;

 

21.        align-content:flex-end;
             justify-content:center;

22.        flex-direction:column-reverse;
             align-items:flex-end;
             justify-content:space-around;

23.        flex-direction:column-reverse;
             flex-wrap:wrap-reverse;
             justify-content:center;
             align-content:center;

24.        order:3;
             align-self:center;

 

 

 align-items:center;  和  align-content:center  的区别：