web蓝桥杯真题：新鲜的蔬菜

 代码：

.box {display: flex;
}
#box1 {align-items: center;justify-content: center;
}#box2 {justify-content: space-between;
}
#box2 .item:nth-child(2) {align-self: end;
}#box3 {justify-content: space-between;
}
#box3 .item:nth-child(2) {align-self: center;
}
#box3 .item:nth-child(3) {align-self: end;
}

知识点：

1.flex布局

align-self控制子项自己在侧轴的排列方式（单个）                //写在子元素里

2.:nth-child(n)

<span>
  <div>1</div>
  <div>2</div>
</span>
div:nth-child(n)        //返回div父元素(span)下第n个div元素，  ！！而不是div的子元素