~あやネころん~
ころん、セミコロン、妖猫竜~あやネころん~。
今日はWordPressのテーマ「Cocoon」内のCocoon汎用ブロックの「ラベルボックス」を学習していくよ。
この記事は
って人向きに発信してるよ。一緒に学んで行こう。
左上部にアイコンのついたラベルのあるボックスを装飾できる。（53種類）
枠の色、背景色、文字色各々基礎色25種+拡張色6種が使用可能。。
※淡い系の色を文字色にするとラベルを目立たせるため背景色を考える必要あり
※枠の色を白にしても枠とアイコンは別色なのでアイコンは同期して消えない。
ラベルボックス
ブロックの説明文にはこう記載が御座います。
ラベルボックス
Cocoonブロック内の説明より引用
ボックスに「ラベル見出し」を入力できる汎用ボックスです。
～ｱﾔﾈｺﾛﾝ～
それではラベルボックスのアイコンを、
53種1行ごとにみていきましょう。
1行目 デフォルト～7種目
2行目 8～14種目
枠の色/ディープオレンジ
枠の色/ディープオレンジ
枠の色/ディープオレンジ
枠の色/ディープオレンジ
枠の色/ディープオレンジ
枠の色/ディープオレンジ
枠の色/ディープオレンジ
3行目 15～21種目
背景色/灰色
背景色/灰色
背景色/灰色
背景色/灰色
背景色/灰色
背景色/灰色
背景色/灰色
4行目 22～28種目
文字色/茶色
文字色/茶色
文字色/茶色
文字色/茶色
文字色/茶色
文字色/茶色
文字色/茶色
5行目 29～35種目
枠の色/天色
背景色/ライム
枠の色/天色
背景色/ライム
枠の色/天色
背景色/ライム
枠の色/天色
背景色/ライム
枠の色/天色
背景色/ライム
枠の色/天色
背景色/ライム
枠の色/天色
背景色/ライム
6行目 36～42種目
枠の色/深緑色
文字色/アンバー
枠の色/深緑色
文字色/アンバー
枠の色/深緑色
文字色/アンバー
枠の色/深緑色
文字色/アンバー
枠の色/深緑色
文字色/アンバー
枠の色/深緑色
文字色/アンバー
枠の色/深緑色
文字色/アンバー
7行目 43～50種目
背景色/緑色
文字色/紺色
背景色/緑色
文字色/紺色
背景色/緑色
文字色/紺色
背景色/緑色
文字色/紺色
背景色/緑色
文字色/紺色
背景色/緑色
文字色/紺色
背景色/緑色
文字色/紺色
背景色/緑色
文字色/紺色
8行目 51～53種目
枠の色/赤色
背景色/淡い黄色
文字色/青色
枠の色/赤色
背景色/淡い黄色
文字色/青色
枠の色/赤色
背景色/淡い黄色
文字色/青色
まとめ
左上部にアイコンのついたラベルのあるボックスを装飾できる。（53種類）
枠の色、背景色、文字色各々基礎色25種+拡張色6種が使用可能。。
※淡い系の色を文字色にするとラベルを目立たせるため背景色を考える必要あり
※枠の色を白にしても枠とアイコンは別色なのでアイコンは同期して消えない。
今回は「ラベルボックス」についてみてきました。
次回は「Cocoon汎用ブロックまとめ」を予定してるよ。
次回の「Cocoon汎用ブロックまとめ」であいましょう。
＞見出しボックス
＞タブ見出しボックス
＞ラベルボックス
記事No23
コメント