★★拡張コンポーネント★★

拡張コンポーネントとは、通常のコンポーネントを元にカスタマイズしたコンポーネントで、
コンポーネントの「+」マークをクリックして「class名」を追記することで、拡張の定義されたコンポーネントへ可変します。
追記するクラス名は、半角英字で、追加する場合は、半角スペースを空けて入力してください。

文字サイズの拡張

文字サイズ16ピクセル（スマホ14ピクセル）の拡張コンポーネントは、class名　「cmp_fnt_16」を追記してください。

文字サイズ18ピクセル（スマホ16ピクセル）の拡張コンポーネントは、class名　「cmp_fnt_18」を追記してください。

文字サイズ20ピクセル（スマホ18ピクセル）の拡張コンポーネントは、class名　「cmp_fnt_20」を追記してください。

文字サイズ22ピクセル（スマホ20ピクセル）の拡張コンポーネントは、class名　「cmp_fnt_22」を追記してください。

リスト（ステップ）の拡張

1通常のリスト（ステップ）
拡張されていないリスト（ステップ）

Underlineリスト（ステップ）の拡張
リスト（ステップ）の見出しに下線を入れる
class名に「cmp_uline_list」を追記

Borderリスト（ステップ）の拡張
リスト（ステップ）に枠線を入れる
class名に「cmp_card_border」を追記

BgColorリスト（ステップ）の拡張
リスト（ステップ）に背景色を入れる
class名に「bg_pink_child」を追記

BgColorリスト（ステップ）の拡張
リスト（ステップ）に背景色を入れる
class名に「bg_navy_child」を追記

Headerリスト（ステップ）の拡張
リスト（ステップ）にヘッダーを入れる
class名に「cmp_list_header」を追記
※「cmp_2colum」を併記して大きく表示

詳しくはこちら

1カラムで見出しに下線
1カラムで見出しに下線を入れる
class名に「cmp_borer_1card」を追記

2カラムで見出しに下線
2カラムで見出しに下線を入れる
class名に「cmp_borer_2card」を追記
2カラムで見出しに下線
2カラムで見出しに下線を入れる
class名に「cmp_borer_2card」を追記

3カラムで見出しに下線
3カラムで見出しに下線を入れる
class名に「cmp_borer_3card」を追記
3カラムで見出しに下線
3カラムで見出しに下線を入れる
class名に「cmp_borer_3card」を追記
3カラムで見出しに下線
3カラムで見出しに下線を入れる
class名に「cmp_borer_3card」を追記

1リスト（ステップ）の左揃え
リスト（ステップ）を左揃えに
class名に「left」と追記

1リスト（ステップ）の見出し左揃え
リスト（ステップ）の見出しを左揃えに
class名に「txt_left」と追記

スマホ時に画像を左にする
class名に「cmp_list_box2」を入れる

カラムの数

1カラムが1つの場合
リスト（ステップ）の見出しを左揃えに
class名に「cmp_1colum」と追記

1カラムが2つの場合
リスト（ステップ）の見出しを左揃えに
class名に「cmp_2colum」と追記
2カラムが2つの場合
リスト（ステップ）の見出しを左揃えに
class名に「cmp_2colum」と追記

1カラムが4つの場合
リスト（ステップ）の見出しを左揃えにclass名に「cmp_4colum」と追記
2カラムが4つの場合
リスト（ステップ）の見出しを左揃えにclass名に「cmp_4colum」と追記
3カラムが4つの場合
リスト（ステップ）の見出しを左揃えにclass名に「cmp_4colum」と追記
4カラムが4つの場合
リスト（ステップ）の見出しを左揃えにclass名に「cmp_4colum」と追記

※デフォルトは、カラムの数が３個

メモ風リストにする場合は、Class名に「cmp_memo_list」を入れてください。
メモ風リストにする場合は、Class名に「cmp_memo_list」を入れてください。

Point1要点を図などを使用して説明する場合
リスト（ステップ）を使用して、ポイント（要点）ごとに説明する場合に使用します。
Class名に「cmp_point_box」を入れて、「cmp_borer_1card」と併記して使用します。
※カード数を増やす場合は、「cmp_borer_2card」などと表示するカード数に合わせて変更してください。

ステップ1
リスト（見出し付）コンポーネントで緑背景+白背景にするには、Class名に「cmp_green_step」と入力
ステップ2
リスト（見出し付）コンポーネントで緑背景+白背景にするには、Class名に「cmp_green_step」と入力

テーブルの拡張

class名に「cmp_green_tbl」を追記すると緑のテーブルに可変

ヘッダー1	ヘッダー2	ヘッダー2	ヘッダー3
セル	セル	セル	セル
セル	セル	セル	セル
セル	セル	セル	セル

画像コンポーネント

田中太郎

画像+テキストのコンポーネントにClass名「cmp_fukidashi」を
記入すれば、吹き出しのような表現となります。

竹田健司

テキスト+画像のコンポーネントにClass名「cmp_fukidashi」を
記入すれば、吹き出しのような表現となります。

拡張コンポーネント

文字サイズの拡張

目次

通常の目次