新登場！ 44ページの電子書籍「CSS in 44 minutes」が発売されました！ 😃

今すぐ入手 →

#align-self

align-itemsと同様に機能しますが、*すべて*のフレックスボックスアイテムではなく、**単一**のフレックスボックスアイテムにのみ適用されます。

デフォルト 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の場合、ターゲットのみが交差軸のベースラインに配置されます。

デフォルトでは、これはテキストのベースラインに沿って配置されることを意味します。

align-self: stretch;

コンテナがalign-items: centerで、**ターゲット**がalign-self: stretchの場合、ターゲットのみが交差軸全体に沿ってストレッチされます。