私のブログはSWELLを利用して作成しているのですが、頻繁に表(テーブル)を使うので、まずは基本を皆様にご紹介いたします。
特に、表の中のテキストを垂直・平行どちらも中央配置にしたいって方はぜひ、参考にしてみてくださいね。
この記事でわかること
- 表(テーブル)の基本的な作成方法
- 表の中のテキストの配置を垂直・平行(縦横)中央配置にしたい
- 表(テーブル)のヘッダーの色を変更したい
SWELLで表を作成する方法|縦横中央にテキストを配置する手順を解説
目次
SWELLで表(テーブル)を作る手順
比較表や料金表など、表(テーブル)を作成したい機会は多いと思います。
早速、表を作成していきましょう。

下記の内容を見た上で、省く箇所があれば、省略してくださいね。
STEP
表を下記の位置に入れていきたいと思います


STEP
右側にプラスマークが出てくるので、プラスをクリック


STEP
プラスマークを押すと右側にブロックエディター出現
ここに【テーブル】がある場合は、テーブルをクリック。
テーブルがない時は「すべてを表示」をクリックする。


STEP
すべて表示をクリックすると左側にさらにブロックエディターが出現


STEP
テーブルをクリック


STEP
作りたい表のカラム数、行数を入力します


5カラム、3行の表が作成される


STEP
カラム数を5、行数を3に設定
ヘッダー(色付き帯)を追加したいので、行数を減らして作成する


STEP
【ヘッダーセクション】を押すと、ヘッダー(色付きの帯)が追加される


STEP
ヘッダーの色を変えたい時は、ヘッダーカラーから選択
ヘッダー(色付き帯)の色を変更する方法


STEP
表の中にテキストを入れていく


STEP
表のカラム数(横の数)が多い時は、【横スクロール】を押せば、見やすくなります





下記からの内容がこの記事で一番伝えたい箇所になります!
STEP
下記のように表の中が揃ってなくて見づらい時は【テーブル全体の中央揃え】を垂直・平行に設定する


【重要】テーブル全体の中央揃えをすると、見た目がスッキリする




ここまでで、表が無事に完成です。
まだまだ背景色を変更したり、背景にアイコンを入れたり、できることがたくさんあるので、今回は基本として抑えておいてくださいね◎

