Wraptasのコピペで使えるサンプル集
/
セクションごとに色分けする機能
セクション
セクション
Wraptasのコピペで使えるサンプル集
/
セクションごとに色分けする機能
セクションごとに色分けする機能
2021/10/13
13:57
2022/2/21
8:53
Notionでは1ページ内で1セクションとなってしまいますが、Wraptasでは同じページ内のコンテンツを自由にセクション分けできる独自機能があります。
使い方
指定のブロックがある部分から、次の指定ブロックがある部分までが一つのセクションになります。
選択出来る項目は
見出し1 (Heading 1)
見出し2 (Heading 2)
見出し3 (Heading 3)
区切り線 (Divider)
になります。
見出しの場合は見出しの上で区切って、区切り線の場合は区切り線を配置した場所からセクションになります。(区切り線はコンテンツ内では非表示になります。)
セクションは次のようなdomにわけられます。
参考CSS
サンプルとして
Heading 2
でセクションを分けて色分けします。
導入し、偶数奇数でセクションごとの背景色を変えるとこのページのような表示になります。
見出し1つめ
〜〜〜見出し1の本文〜〜〜
〜〜〜見出し1の本文〜〜〜
〜〜〜見出し1の本文〜〜〜
〜〜〜見出し1の本文〜〜〜
〜〜〜見出し1の本文〜〜〜
見出し2つめ
〜〜〜見出し2の本文〜〜〜
〜〜〜見出し2の本文〜〜〜
〜〜〜見出し2の本文〜〜〜
〜〜〜見出し2の本文〜〜〜
〜〜〜見出し2の本文〜〜〜
見出し3つめ
〜〜〜見出し3の本文〜〜〜
〜〜〜見出し3の本文〜〜〜
〜〜〜見出し3の本文〜〜〜
〜〜〜見出し3の本文〜〜〜
〜〜〜見出し3の本文〜〜〜
Xでポスト