ゲーテンベルクの表(ブロック)の機能を使えば、HTMLを記述しなくても表が作成できます。
行と列で作られています。
HTMLでテーブルを記述するには、以下様なタグを使います。
代表的なタグ
・ tableタグ:表を作成する範囲を挟みます。
・ trタグ:表内に1行を作成します。
・ thタグ:行内に見出しのセルを作成します。
・ tdタグ:行内にデータのセルを作成します。
簡単なテーブル記述例
![テーブルHTMLリスト](https://yuzu-site.net/wp-content/uploads/2020/02/HTML_Tbl01-1-330x600.png)
![サンプルテーブル](https://yuzu-site.net/wp-content/uploads/2020/02/HTML_Tbl01-2-600x232.png)
ブロック追加
「プラス」をクリックします。
![ブロック追加](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl01-1.png)
表を選択
「フォーマット」>「表」をクリックします。
![ブロック フォーマット](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl01-2-1.png)
よく使うものに「表」があれば、そのまま「表」をクリックします。
サイズを入力
「列数」と「行数」を入力し、「表を作成」クリックします。
![ゲーテンベルク ブロック データ挿入](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl02-600x312.png)
表
表の枠が作成されます。セルに文字を入力します。
![サンプル テーブル](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl01-4-1-600x236.png)
表(イメージ)
![サンプル テーブル](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl01-5-600x237.png)
![ブロックツールバー](https://yuzu-site.net/wp-content/uploads/2020/02/TblBlock-1.png)
① | スタイルを変更 | 無地とストライプの切り替える。 |
② | 配置を変更 | テーブルの配置位置を変更する。 |
③ | 表の編集 | 行・列の追加、削除する。 |
④ | カラムの配置を変更 | カラムの表示位置を変更する。 |
⑤ | 太字 | 太字表示する。 |
⑥ | イタリック | イタリック表示する。 |
![ブロックツールバー スタイル変更](https://yuzu-site.net/wp-content/uploads/2020/02/TblBlock-1-1.png)
無地とストライプの切り替える。
デフォルト | 行の背景 無地 |
ストライプ | 行の背景 ストライム |
背景色は右サイドのブロックより、グレー、ブルー、グリーン、ピンクを選べます。
![ブロックスタイル](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl11-1.png)
![ブロックツールバー 配置変更](https://yuzu-site.net/wp-content/uploads/2020/02/TblBlock-2.png)
ブロック内で、テーブルの配置位置を変更する。
左揃え | 左に揃えます。 |
中央揃え | 中央に揃えます。 |
右揃え | 右に揃えます。 |
幅広 | 幅を広く揃えます。 |
全幅 | ブロックいっぱいに揃えます。 |
・左揃え
![ブロックツールバー 配置変更 左揃え](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl21-1-1-600x111.png)
・中央揃え
![ブロックツールバー 配置変更 中央え](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl21-2-600x116.png)
・右揃え
![ブロックツールバー 配置変更 右揃え](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl22-1-1-600x115.png)
・幅広
![ブロックツールバー 配置変更 幅広](https://yuzu-site.net/wp-content/uploads/2020/03/Tbl23-1-600x117.png)
・全幅
![ブロックツールバー 配置変更 全幅](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl24-1-1-600x84.png)
![ブロックツールバー 表変更](https://yuzu-site.net/wp-content/uploads/2020/02/TblBlock-3.png)
行・列の追加、削除する。
上に行を追加 | カーソルの上に行を追加します。 |
下に行を追加 | カーソルの下に行を追加します。 |
行の削除 | カーソル行を削除します。 |
左に列を追加 | カーソルの左に列を追加します。 |
右に列を追加 | カーソルの右に列を追加します。 |
列の削除 | カーソル列を削除します。 |
右に列を追加
![ブロックツールバー 表変更 右に列追加](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl31-1-2-600x229.png)
追加後
![ゲーテンベルク ブロック 表編集 右列追加](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl31-2-600x235.png)
下に行を追加
![ブロックツールバー 表変更 下に行追加](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl32-1-2-600x228.png)
追加後
![ゲーテンベルク ブロック 表編集 下行追加](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl32-2-600x283.png)
行の削除
![ブロックツールバー 表変更 行の削除](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl33-1-2-600x273.png)
削除後
![ゲーテンベルク ブロック 表編集 行削除](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl33-2-600x234.png)
列の削除
![ブロックツールバー 表変更 列の削除](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl34-1-2-600x231.png)
削除後
![ゲーテンベルク ブロック 表編集 列削除](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl34-2-600x242.png)
![ブロックツールバー カラム配置変更](https://yuzu-site.net/wp-content/uploads/2020/02/TblBlock-4.png)
カラムの表示位置を変更する。
カラムの左寄せ | カラム文字を左に寄せる。 |
カラムの中央配置 | カラム文字を中央に寄せる。 |
カラムの右寄せ | カラム文字を右に寄せる。 |
カラムの右寄せ
![ブロックツールバー カラム配置変更 右寄せ](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl35-1-2-600x236.png)
右寄せ後
![ゲーテンベルク ブロック カラム配置 右寄せ](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl35-2-600x235.png)
![ブロックツールバー 太字](https://yuzu-site.net/wp-content/uploads/2020/02/TblBlock-5.png)
太字表示する。
![ゲーテンベルク カラム装飾 太字](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl41-2-600x233.png)
![ブロックツールバー イタリック](https://yuzu-site.net/wp-content/uploads/2020/02/TblBlock-6.png)
イタリック表示する。
![ゲーテンベルク カラム装飾 イタリック](https://yuzu-site.net/wp-content/uploads/2020/02/Tbl42-2-600x239.png)
テーブルがビジュアル的に作成できるので、初心者でも簡単です。
HTMLを記述しなくても、テーブルを表示することが可能です。列・行の追加、削除やカラムの左寄せ、中央、右寄せも出来ます。