ブロックサンプル：タブ見出しボックス（1/1）

タブ見出しボックス（1/1）

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

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

sample-00283 / cocoon-blocks/tab-caption-box　基本形

sample-00284 / cocoon-blocks/tab-caption-box　content：content="短いサンプル"

sample-00285 / cocoon-blocks/tab-caption-box　content：content="春の朝、窓を開けると柔らかな風が入りました。これは文字の大きさ、行間、色、折り返しを比較するための日本語サンプルです。春の朝、窓を開けると柔らかな風が入りました。これは文字の大きさ、行間、色、折り返しを比較するための日本語サンプルです。春の朝、窓を開けると柔らかな風が入りました。これは文字の大きさ、行間、色、折り返しを比較するための日本語サンプルです。"

sample-00286 / cocoon-blocks/tab-caption-box　色設定：color=""

sample-00287 / cocoon-blocks/tab-caption-box　色設定：color=" tcb-yellow"

sample-00288 / cocoon-blocks/tab-caption-box　色設定：color=" tcb-red"

sample-00289 / cocoon-blocks/tab-caption-box　色設定：color=" tcb-blue"

sample-00290 / cocoon-blocks/tab-caption-box　色設定：color=" tcb-green"

sample-00291 / cocoon-blocks/tab-caption-box　icon：icon="fa-check"

sample-00292 / cocoon-blocks/tab-caption-box　icon：icon="fa-star"

sample-00293 / cocoon-blocks/tab-caption-box　icon：icon="fa-lightbulb-o"

sample-00294 / cocoon-blocks/tab-caption-box　lock：lock={"move":false,"remove":false}

sample-00295 / cocoon-blocks/tab-caption-box　lock：lock={"move":true,"remove":false}

sample-00296 / cocoon-blocks/tab-caption-box　lock：lock={"move":false,"remove":true}

sample-00297 / cocoon-blocks/tab-caption-box　lock：lock={"move":true,"remove":true}

sample-00298 / cocoon-blocks/tab-caption-box　className：className="block-gallery-example"

sample-00299 / cocoon-blocks/tab-caption-box　extraBottomMargin：extraBottomMargin=""

sample-00300 / cocoon-blocks/tab-caption-box　extraBottomMargin：extraBottomMargin="0"

sample-00301 / cocoon-blocks/tab-caption-box　extraBottomMargin：extraBottomMargin="2"

sample-00302 / cocoon-blocks/tab-caption-box　extraBottomMargin：extraBottomMargin="10"

sample-00303 / cocoon-blocks/tab-caption-box　extraBottomMargin：extraBottomMargin="20"

sample-00304 / cocoon-blocks/tab-caption-box　長文と装飾の組み合わせ