Flow relative values (フロー関連値)
CSS において、フロー関連値は、要素のブロック軸とインライン軸に対する方向のキーワード値です。これらの値には、block-start、block-end、inline-start、inline-end、start、end があります。
CSS において、物理的プロパティは、要素の物理的な方向と特定の辺の参照に基づいた位置を定義します。
一方で、 CSS の論理的プロパティは、ビューポートの物理的な寸法ではなく、文書の書字方向や方向に基づいてスタイルを定義します。論理的プロパティはコンテンツの流れに関連し、ブロック軸とインライン軸に関連する方向キーワードを使用します。
ブロック方向
ブロック軸とは、ブロックレイアウトにおける要素の積み重ね順序を定義する軸を参照します。段落 (<p>)、見出し、div (<div>) などのコンテンツのブロックがウェブページにレイアウトされる方向です。これはブロック方向とも呼ばれます。左書きの言語や右書きの言語では、ブロックの方向はコンテンツの流れの垂直方向で、上から下に進みます。
ブロック先頭 (block-start) 方向とブロック末尾 (block-end) 方向は、それぞれブロック軸に沿ったコンテンツの先頭と 末尾、または "from" 方向と "to" 方向を表し、横書き方向ではブロック先頭が上端 (top)、ブロック末尾が下端 (bottom) に相当します。
インライン方向
インライン軸はブロック軸に垂直です。インライン軸は、ブロック内でテキストなどのインラインコンテンツが流れる方向を表します。これはインライン方向とも呼ばれます。英語のような左書きの書字方向では、インライン方向は左から右への横方向です。アラビア語やヘブライ語のような右書きの言語では、インライン方向は水平で右から左です。
インライン先頭とインライン末尾は、それぞれインライン軸に沿ったコンテンツの開始端と 終了端を表し、インライン先頭と インライン末尾のプロパティと値は、横書き方向では左右のプロパティと値に相当します。右と左のどちらに相当するかは、書字方向によって異なります。例えば、インライン先頭は左書きの言語では左 (left) に、右書きの言語では右 (right) に相当します。
先頭と末尾
CSS プロパティの効果には、一次元的なものと二次元的なものがあります。例えば、 text-align はテキストのインライン方向だけに関係するので、一次元です。文脈上、一次元に制約される場合、フロー関連のキーワードは、先頭 (start) または末尾 (end) に短縮されます。