ブロックサンプル：マイクロテキスト（1/2）

マイクロテキスト（1/2）

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

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

sample-02564 / cocoon-blocks/micro-text　基本形

sample-02565 / cocoon-blocks/micro-text　content：content="短いサンプル"

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

sample-02567 / cocoon-blocks/micro-text　タイプ：type="micro-top"

sample-02568 / cocoon-blocks/micro-text　タイプ：type="micro-bottom"

sample-02569 / cocoon-blocks/micro-text　icon：icon="fa-check"

sample-02570 / cocoon-blocks/micro-text　icon：icon="fa-star"

sample-02571 / cocoon-blocks/micro-text　icon：icon="fa-lightbulb-o"

sample-02572 / cocoon-blocks/micro-text　align：align=""

sample-02573 / cocoon-blocks/micro-text　align：align="left"

sample-02574 / cocoon-blocks/micro-text　align：align="center"

sample-02575 / cocoon-blocks/micro-text　align：align="right"

sample-02576 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="key-color"

sample-02577 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="red"

sample-02578 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="pink"

sample-02579 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="purple"

sample-02580 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="deep"

sample-02581 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="indigo"

sample-02582 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="blue"

sample-02583 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="light-blue"

sample-02584 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="cyan"

sample-02585 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="teal"

sample-02586 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="green"

sample-02587 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="light-green"

sample-02588 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="lime"

sample-02589 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="yellow"

sample-02590 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="amber"

sample-02591 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="orange"

sample-02592 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="deep-orange"

sample-02593 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="brown"

sample-02594 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="light-grey"

sample-02595 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="grey"

sample-02596 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="dark-grey"

sample-02597 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="cocoon-black"

sample-02598 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="cocoon-white"

sample-02599 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="watery-blue"

sample-02600 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="watery-yellow"

sample-02601 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="watery-red"

sample-02602 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="watery-green"

sample-02603 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="ex-a"

sample-02604 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="ex-b"

sample-02605 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="ex-c"

sample-02606 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="ex-d"

sample-02607 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="ex-e"

sample-02608 / cocoon-blocks/micro-text　backgroundColor：backgroundColor="ex-f"

sample-02609 / cocoon-blocks/micro-text　プリセットの前景色：textColor="key-color" / borderColor="key-color"

sample-02610 / cocoon-blocks/micro-text　プリセットの前景色：textColor="red" / borderColor="red"

sample-02611 / cocoon-blocks/micro-text　プリセットの前景色：textColor="pink" / borderColor="pink"

sample-02612 / cocoon-blocks/micro-text　プリセットの前景色：textColor="purple" / borderColor="purple"

sample-02613 / cocoon-blocks/micro-text　プリセットの前景色：textColor="deep" / borderColor="deep"

sample-02614 / cocoon-blocks/micro-text　プリセットの前景色：textColor="indigo" / borderColor="indigo"

sample-02615 / cocoon-blocks/micro-text　プリセットの前景色：textColor="blue" / borderColor="blue"

sample-02616 / cocoon-blocks/micro-text　プリセットの前景色：textColor="light-blue" / borderColor="light-blue"

sample-02617 / cocoon-blocks/micro-text　プリセットの前景色：textColor="cyan" / borderColor="cyan"

sample-02618 / cocoon-blocks/micro-text　プリセットの前景色：textColor="teal" / borderColor="teal"

sample-02619 / cocoon-blocks/micro-text　プリセットの前景色：textColor="green" / borderColor="green"

sample-02620 / cocoon-blocks/micro-text　プリセットの前景色：textColor="light-green" / borderColor="light-green"

sample-02621 / cocoon-blocks/micro-text　プリセットの前景色：textColor="lime" / borderColor="lime"

sample-02622 / cocoon-blocks/micro-text　プリセットの前景色：textColor="yellow" / borderColor="yellow"

sample-02623 / cocoon-blocks/micro-text　プリセットの前景色：textColor="amber" / borderColor="amber"

sample-02624 / cocoon-blocks/micro-text　プリセットの前景色：textColor="orange" / borderColor="orange"

sample-02625 / cocoon-blocks/micro-text　プリセットの前景色：textColor="deep-orange" / borderColor="deep-orange"

sample-02626 / cocoon-blocks/micro-text　プリセットの前景色：textColor="brown" / borderColor="brown"

sample-02627 / cocoon-blocks/micro-text　プリセットの前景色：textColor="light-grey" / borderColor="light-grey"

sample-02628 / cocoon-blocks/micro-text　プリセットの前景色：textColor="grey" / borderColor="grey"

sample-02629 / cocoon-blocks/micro-text　プリセットの前景色：textColor="dark-grey" / borderColor="dark-grey"

sample-02630 / cocoon-blocks/micro-text　プリセットの前景色：textColor="cocoon-black" / borderColor="cocoon-black"

sample-02631 / cocoon-blocks/micro-text　プリセットの前景色：textColor="cocoon-white" / borderColor="cocoon-white"

sample-02632 / cocoon-blocks/micro-text　プリセットの前景色：textColor="watery-blue" / borderColor="watery-blue"

sample-02633 / cocoon-blocks/micro-text　プリセットの前景色：textColor="watery-yellow" / borderColor="watery-yellow"

sample-02634 / cocoon-blocks/micro-text　プリセットの前景色：textColor="watery-red" / borderColor="watery-red"

sample-02635 / cocoon-blocks/micro-text　プリセットの前景色：textColor="watery-green" / borderColor="watery-green"

sample-02636 / cocoon-blocks/micro-text　プリセットの前景色：textColor="ex-a" / borderColor="ex-a"

sample-02637 / cocoon-blocks/micro-text　プリセットの前景色：textColor="ex-b" / borderColor="ex-b"

sample-02638 / cocoon-blocks/micro-text　プリセットの前景色：textColor="ex-c" / borderColor="ex-c"

sample-02639 / cocoon-blocks/micro-text　プリセットの前景色：textColor="ex-d" / borderColor="ex-d"

sample-02640 / cocoon-blocks/micro-text　プリセットの前景色：textColor="ex-e" / borderColor="ex-e"

sample-02641 / cocoon-blocks/micro-text　プリセットの前景色：textColor="ex-f" / borderColor="ex-f"

sample-02642 / cocoon-blocks/micro-text　customTextColor：customTextColor="#19448e"

sample-02643 / cocoon-blocks/micro-text　customTextColor：customTextColor="#fff3ce"