スタイリング
Taffy のスタイリングプロパティに関する包括的なガイド。
Taffy のスタイリング API は CSS をモデルにしています。以下は、サポートされているすべてのプロパティの分類リストです。
レイアウトモード
ノードの動作を定義するコアプロパティ。
| プロパティ | 説明 |
|---|---|
display | Flex(デフォルト)、Grid、または None。 |
position | Relative(フロー)または Absolute(オーバーレイ)。 |
overflow | Visible、Hidden、または Scroll。 |
inset | ポジショニング用の top、bottom、left、right。 |
サイズと間隔
寸法と間隔を制御します。
| プロパティ | 説明 |
|---|---|
size / minSize / maxSize | 幅と高さの制御。 |
aspectRatio | 幅と高さの比率。 |
margin | 外側の余白。 |
padding | 内側の余白。 |
border | 枠線の幅(スペースのみ)。 |
gap | Flex/Grid アイテム間の間隔。 |
Flexbox レイアウト
1D レイアウトのプロパティ。
| プロパティ | 説明 |
|---|---|
flexDirection | Row または Column の方向。 |
flexWrap | Wrap または NoWrap。 |
flexBasis | 初期メインサイズ。 |
flexGrow | 伸長係数。 |
flexShrink | 収縮係数。 |
justifyContent | メイン軸の整列。 |
alignItems | デフォルトのクロス軸の整列。 |
alignSelf | アイテムの整列オーバーライド。 |
alignContent | 折り返し行の整列。 |
Grid レイアウト
2D レイアウトのプロパティ。
| プロパティ | 説明 |
|---|---|
gridTemplate | 列と行を定義します。 |
gridColumn | 列方向へのアイテムの配置。 |
gridRow | 行方向へのアイテムの配置。 |
gridAutoFlow | 自動配置アルゴリズム。 |