表示モード (Display)
ノードのレイアウト動作を定義します。
display プロパティは、ノードの子要素に使用される内部レイアウトアルゴリズムを決定します。
値
| 値 | 説明 |
|---|---|
Flex | デフォルト。Flexbox で子要素を行または列に配置します。 |
Grid | CSS Grid で子要素を 2 次元のグリッドに配置します。 |
Block | 通常フロー、マージンの相殺、浮動を扱うブロックレイアウトを使用します。 |
FlowRoot | ブロックレイアウトを使用し、浮動を内包する独立したブロック整形コンテキストを常に作成します。 |
None | ノードとその子孫をレイアウトから除外し、サイズをゼロにします。ツリー構造は保持されます。 |
書字方向、浮動、回り込みの解除
direction は Direction.Ltr(デフォルト)または Direction.Rtl を取り、論理方向を制御します。各 Style は独自の方向を持つため、子ノードのスタイルにも必要な方向を設定してください。
ブロックレイアウトの float は Float.None(デフォルト)、Float.Left、Float.Right を取ります。clear は Clear.None(デフォルト)、Clear.Left、Clear.Right、Clear.Both を取ります。Left と Right は物理方向です。浮動する子ノードをコンテナに内包するには Display.FlowRoot を使います。
例
Loading Preview…