ブロックサンプル：タブ（5/5）

タブ（5/5）

ブロックの設定を比較するサンプルです。各例の直前に変更設定と値を記載しています。

画像等は同梱素材を使用します。コピー用コードと書かれた例は、説明に従って必要なデータ・編集場所を用意してください。

sample-07677 / core/tabs　余白の組み合わせ：style.spacing.padding={"top":"2rem","right":"2rem","bottom":"2rem","left":"2rem"} / style.spacing.margin={"top":"2rem","right":"2rem","bottom":"2rem","left":"2rem"} / style.spacing.blockGap="2rem"

sample-07678 / core/tabs　layout：layout={"type":"constrained"}

sample-07679 / core/tabs　layout：layout={"type":"flex","flexWrap":"wrap","justifyContent":"center"}

sample-07680 / core/tabs　layout：layout={"type":"flex","orientation":"vertical","justifyContent":"left"}

sample-07681 / core/tabs　layout：layout={"type":"grid","columnCount":2}

sample-07682 / core/tabs　extraBottomMargin：extraBottomMargin=""

sample-07683 / core/tabs　extraBottomMargin：extraBottomMargin="0"

sample-07684 / core/tabs　extraBottomMargin：extraBottomMargin="2"

sample-07685 / core/tabs　extraBottomMargin：extraBottomMargin="10"

sample-07686 / core/tabs　extraBottomMargin：extraBottomMargin="20"

sample-07687 / core/tabs　組み合わせ：濃い背景と白い文字