#align-self

原理如同 align-items，但是仅仅作用于一个 flexbox 元素，而不是作用于所有的元素

默认属性 align-self: auto;

元素使用 align-items 的值。

align-self: flex-start;

如果容器有属性 align-items: center 且 目标元素 有属性 align-self: flex-start，那么仅仅目标元素对齐于纵向轴的起始处。

默认，这就意味着元素对齐于垂直方向的顶部。

align-self: flex-end;

如果容器有属性 align-items: center 且 目标元素 有属性 align-self: flex-end，那么仅仅目标元素对齐于纵向轴的末尾处。

默认，这就意味着元素对齐于垂直方向的底部。

align-self: center;

如果容器有属性 align-items: flex-start 且 目标元素 有属性 align-self: center，那么仅仅目标元素对齐于纵向轴的中间。

默认，这就意味着元素对齐于垂直方向的中间。

align-self: baseline;

如果容器有属性 align-items: center 且 目标元素 有属性 align-self: baseline，那么仅仅目标元素对齐于纵向轴的 baseline。

默认，这就意味着元素沿着文字的 baseline 对齐。

align-self: stretch;

如果容器有属性 align-items: center 且 目标元素 有属性 align-self: stretch，那么仅仅目标元素拉伸填充于整个纵向轴。