装飾ルール

Cocoonの装飾サンプルです。詳しくは公式サイトを確認してください。

  1. Cocoon レイアウト見本
  2. Cocoon Blocksの現在の対応状況

H2タグの見本

H3タグの見本

H4タグの見本

H5タグの見本

 

各種タグ表示見本

テキストの装飾

1: 蛍光マーカー
※ボタンクリック、ショートカットもそのうち割り当てたい

2: 太字
※ボタンクリック、もしくはショートカット 「Win: Ctrl+B Mac: ⌘+B」

3: 赤太字
※後述する「Quicktags」から選択できます。

 

リストタグ(ul)

  • リストタグ
  • リストタグ
  • リストタグ

リストタグ(ol)

  1. リストタグ
  2. リストタグ
  3. リストタグ

表(table)

メーカー 2021年省エネ基準達成率 年間消費電力量(50/60Hz) 年間目安電気料金
東芝 101% 249kWh/年 6,723円
シャープ 104% 240kWh/年 6,480円
三菱 104% 245kWh/年 6,615円
パナソニック 107% 259kWh/年 6,993円
日立 105% 250kWh/年

6,750円

Advanced Editor Tools」の「表」機能から作成するか、エクセルからコピペして作成します。

スマホなど横幅が小さな環境では、自動敵に横スクロールを表示します。

なお、thタグを設定するには、

「表」→「セル」→「セルの詳細設定」

と進み、「一般」タブのセルタイプを「ヘッダーセル」に変更することで適用可能です。


 

Quicktags

それぞれ以下のように表示されます。

【ボックス】重要(背景黄色)

ボックス単体で使用した場合↓
文章を入力文章を入力文章を入力文章を入力文章を入力。
リストタグと併用した場合↓
  • リスト項目1
  • リスト項目2
  • リスト項目3

※動作に癖があるので、慣れるまで注意してください。今後改善します。

 

【ボックス】緑の点線(タイトルあり)

タイトル

タイトル欄本文を設定可能です。

タイトル欄を削除した場合の表示例です。

【ボックス】警告(赤)

注意文などを表示する際に使用します。
 

【ボックス】リンク・参考記事など(青)

 

タイトルとURLをコピーしました