JIMDO EXPERT
今すぐJimdoに登録する
メニューの表示切り替え

HOME  > 実践!ホームページ作成! > 第16回 表マスター!

【連載】 実践!Jimdoでホームページ作成!

第16回 表マスター!

チッチ

今日は前回のつづき、表の設定について説明するよ!

そのまえに少し前回のおさらいをしてみよう。

あっくん、「行」「列」「セル」について覚えてる?

あっくん

ええっと・・・表の縦が・・・あれ?横だったかな?えっと・・・

チッチ

この図を見て思い出してみようね。

「行」「列」「セル」は表をつくったり、いろいろな設定をするときに必要だから覚えておいてね。

表の各部分の名称

表の各部分の名称

セル ・・・ 表の1つ1つのマスのことを「セル」といいます。

・・・ 「セル」の横並びのまとまりを「行」といいます。

・・・ 「セル」の縦並びのまとまりを「列」といいます。

あっくん

思い出したよ!縦に並んだ「セル」を「列」、横に並んだ「セル」を「行」っていうんだったね。

チッチ

そうだよ!おさらいはできたかな?

じゃあ、さっそく、表の設定について解説していくよ!

あっくんが前回つくった表を見せて!

あっくん

うん!これが、前回ぼくがつくった表だよ~。

この表をもっと見やすくしたいんだ。

表
チッチ

まかせて!はじめに表全体の設定について教えるね。

まず、つくった表をクリックして、表の編集画面を開いたら、「表のプロパティ」のアイコンをクリックしてごらん。

表を挿入
あっくん

はーい!「表のプロパティ」っていう小さなウィンドウが表示されたよ!

チッチ

この「表のプロパティ」から表全体のいろいろな設定を編集できるんだよ。

たとえば、表の罫線を表示させたり、表の背景に色をつけたりできるんだ!

表のプロパティ

表の挿入/編集

外側の余白 ・・・ セルとセルの間隔を指定できます。

内側の余白 ・・・ セル内の余白を指定できます。

罫線のサイズ ・・・罫線の幅を指定できます。

罫線の色 ・・・ 罫線の色を指定できます。

背景色 ・・・表全体の背景色を指定できます。

あっくん

ええっと・・・表に枠線をつけるにはどうしたらいいのかなぁ?

チッチ

3番の「罫線のサイズ」の項目に「1」と入力して、4番のところをクリックして好きな灰色を選んでごらん。

表全体を囲む1ピクセルの太さの線が表示されるよ。

あっくん

表の外枠ができた!!

表の内側の線はどうやってつけるの?

チッチ

内側の設定は「セルのプロパティ」で設定していくよ!

「表のプロパティ」が表全体の設定なのに対して、「セルのプロパティ」は1つのセルごとに設定ができるんだよ。

今回は全部のセルに罫線をつける設定をするから、まずは表の一番左上のセルをクリックして、クリックしたまま一番右下のセルまでドラッグして全体が青色に選択された状態にしよう!

そのあと「セルのプロパティ」アイコンをクリックしてね。

あっくん

はーい!!

今度は「セルのプロパティ」っていう小さなウィンドウが開いたけど、さっきの「表のプロパティ」と似てるね!

セルのプロパティ

セルのプロパティ

・・・ セルの横幅を指定できます。

高さ ・・・ セルの高さを指定できます。

罫線のサイズ ・・・罫線の幅を指定できます。

罫線の色 ・・・ 罫線の色を指定できます。

背景色 ・・・表全体の背景色を指定できます。

チッチ

あっくん鋭い!

設定画面は「表のプロパティ」とほとんど同じ内容だから、さっきと同じく「罫線のサイズ」に「1」って入力して、「罫線の色」にさっきと同じ灰色を設定してみよう。

あっくん

わぁ!!枠線の完成!!

じゃあ、つぎはね、線と文字の間隔をもっと広くしたいなぁ!

表
チッチ

そんなときは「表のプロパティ」の項目にある2番の「内側の余白」を「10」にしてごらん。

セルの内側に10ピクセルの余白ができるよ。

あっくん

わーい!すごく見やすくなった!!

こんなに簡単に表の設定が変えられるなんて思わなかったよ!

表
あっくん

表全体の設定と行と列とセルの設定ができれば、自由自在に表がつくれるね。

こんなに簡単にかっこいい表ができちゃうなんてすごい!!

チッチ

設定の項目がたくさんあって難しく感じるかもしれないけど、少しずつ覚えていけば大丈夫!

表の設定の仕方をマスターしていろんな表をつくってみてね!

あっくん

よーし!早速おいしいケーキ屋さんのリストをつくるぞー!!

チッチ

あっくん・・・ダイエットのためにカロリー表をつくるんじゃなかったの・・・?

表は情報を整理して見せたい時に便利なので、ぜひ活用しましょう!

あっくん、おいしいケーキ屋さんのリストできたら教えてね。