表・比較表ブロックを使わないシンプルな表の作り方

【STEP8】上級編・応用編新マニュアル

【STEP1】表を入れるためのセクションブロックを設置

このセクションブロックが表を内包する親ブロックになります。

親ブロックに子ブロック（表）を入れてグループ化することで、

後でまとめて余白の調整を行うことができたり、
スクロールアニメーションを付与できたり、
まとめて操作する際などにも効率的です。

ただし前提として、

この表のためのセクションブロックを入れる目的でも、
さらに親となるセクションブロックが必要です。

設置イメージはこんな感じになります。

（１）セクションブロック
　└（２）セクションブロック
　　　└（３）表（１行分）のセクションブロック

セクションブロックを配置したら表自体の余計な余白を無くすために、

最大幅：フルワイド
内側余白：全０

に設定します。

※表の全体に余白が欲しい場合は自由に調整していただいて構いません

見やすい表を作るためには、
行ごとを仕切るための「線」が必要になります。

セクションブロックを選択し「枠線設定」で下線のみに、
線の種類や色、太さなどの調整を施します。

スタイルで選べる線の種類は

・単色（実線）
・破線
・点線

になります。

また、ここでも余計な余白をなくすために、

最大幅：フルワイド
内側余白：全０

に設定します。

さらに、このあと作る下の行との行間を確保したいので
外側下の余白を「小」に設定しましょう。

通常は左側が項目になるので、左30%、右70%くらいに幅を調整します。
※左右それぞれのカラムを選択して、値を％にしてから数値を入力してください

また、スマホで見たときに縦に並ばないようにしたいので、
この段階で「モバイルでは縦に並べる」のチェックを解除しておきましょう。

項目の枠で上下左右の余白を確保するために

見出しスタイル：枠

を選択して、背景色をクリアします。

そして、フォントの種類やサイズの調整を行い
（例：PCは100%、スマホは75%）、

サイドパネルの「テキスト揃え設定」で、
項目名を左右中央のどちらに寄せるかを設定します。

右側のカラムでも同様の設定をする必要がありますが、

ここで作った見出し（小）ブロックをコピペして
文字を打ちかえると何度も同じ設定をする手間が省けます。

ここまでの段階で、項目と内容がセットとなる
１行分を作ることができました。

次はこのワンセット（セクションブロック）をコピーして、
下にどんどん追加（ペースト）していきます。

最初に必要な分だけ先にコピペしておくと、
このあとシンプルにサクサク進めていけるのでおすすめです。

▼完成した表はこちら
https://ctp.ctw-contents.com/lptools/lp/sample-simple-table/