10. 表の作り方
〜 テーブルで自由自在にレイアウト 〜
ウェブページでは、簡単に次のような表を作ることができます。 あさがお ひまわり ラベンダー ヒルガオ科 キク科 シソ科 表の中には文字だけでなく画像やフォームなども入れることができ、表の中に表を入れることもできます。 また、まるで新聞のように自由なレイアウトのウェブページを見ることがありますが、実はそのようなページは、「枠のない表」を使ってレイアウトしているのです。 テキストを段組にしたり、画像とテキストを上手に並べてアルバムのようにしたり・・・と、いろいろな使い方ができます。
ウェブページでは、簡単に次のような表を作ることができます。
表の中には文字だけでなく画像やフォームなども入れることができ、表の中に表を入れることもできます。
また、まるで新聞のように自由なレイアウトのウェブページを見ることがありますが、実はそのようなページは、「枠のない表」を使ってレイアウトしているのです。
テキストを段組にしたり、画像とテキストを上手に並べてアルバムのようにしたり・・・と、いろいろな使い方ができます。
表を作るには、ツールバーの［表の挿入］ボタンを押して、必要な大きさを選びます。 ［表の挿入］ すると、次のような何も入っていない表が作成されます。 あとは表の各欄（セルといいます）に文字を入力したり、画像を張り付けたりするだけです。 ここで表の枠が点線で表示されていますが、この点線の枠は入力しやすいように表示されているだけで、実際にブラウザで見たときには表示されませんので注意しましょう。 枠を付けたいときには、後ほど説明する「表のプロパティ」で外枠のサイズを指定する必要があります。 表は ［表（A）］→［表の挿入（I）］ からも同じように作ることができます。
表を作るには、ツールバーの［表の挿入］ボタンを押して、必要な大きさを選びます。
［表の挿入］
すると、次のような何も入っていない表が作成されます。
あとは表の各欄（セルといいます）に文字を入力したり、画像を張り付けたりするだけです。
ここで表の枠が点線で表示されていますが、この点線の枠は入力しやすいように表示されているだけで、実際にブラウザで見たときには表示されませんので注意しましょう。
枠を付けたいときには、後ほど説明する「表のプロパティ」で外枠のサイズを指定する必要があります。
表は ［表（A）］→［表の挿入（I）］ からも同じように作ることができます。
表の上や下に表のタイトル（表題）を入れることができます。 表題の挿入は、表のどこかをポイントして ［表（A）］→［表題の挿入（A）］ から行います。表の上に入力カーソルが移動しますので、そこに表題を入力します。 また、表題は表の下に付けることもできます。表題の部分で ［右クリック］→［表題のプロパティ］ を選んで変更します。
表の上や下に表のタイトル（表題）を入れることができます。
表題の挿入は、表のどこかをポイントして ［表（A）］→［表題の挿入（A）］ から行います。表の上に入力カーソルが移動しますので、そこに表題を入力します。
また、表題は表の下に付けることもできます。表題の部分で ［右クリック］→［表題のプロパティ］ を選んで変更します。
表の一つ一つの入力欄fを 「セル」 といいます。 次のような方法で表全体やセルを選択することができます。 ● 表全体の選択 表の左側にある編集画面の空白の領域をダブルクリックします。 表のどこかをポイントして ［表（A）］→［表の選択（T）］ からでも選択できます。 ● セルの選択 セルの中で ［Alt］キー を押しながらマウスを ［クリック］ するとセルを選択できます。 表のどこかをポイントして ［表（A）］→［セルの選択（E）］ からでも選択できます。 また、複数のセルの選択は ［Shift］キー＋［Alt］キー＋［クリック］ または ［Ctrl］キー＋［Alt］キー＋［クリック］ で行います。 ● 行の選択 表の左端の枠の部分にマウスカーソルを持っていき、カーソルが に変わるところでクリックします。マウスをクリックしたままドラッグすると複数の行を選択できます。 また、選択したい行のどこかをポイントして ［表（A）］→［行の選択（R）］ でも選択できます。 ● 列の選択 表の上端の枠の部分にマウスカーソルを持っていき、カーソルが に変わるところでクリックします。マウスをクリックしたままドラッグすると複数の列を選択できます。 また、選択したい列のどこかをポイントして ［表（A）］→［列の選択（U）］ でも選択できます。 表やセルを削除するには、削除したい表やセルを選択して、［Delete］キー または ［編集（E）］→［クリア（A）］を選びます。
表の一つ一つの入力欄fを 「セル」 といいます。
表やセルを削除するには、削除したい表やセルを選択して、［Delete］キー または ［編集（E）］→［クリア（A）］を選びます。
表の位置や大きさ、枠線や色の指定は ［表のプロパティ］ から行います。 表のプロパティは、表のどこかをポイントして ［右クリック］→［表のプロパティ］ で表示できます。
表の位置や大きさ、枠線や色の指定は ［表のプロパティ］ から行います。
表のプロパティは、表のどこかをポイントして ［右クリック］→［表のプロパティ］ で表示できます。
表のプロパティ
「レイアウト」 ● 配置（L） 表の画面での位置を標準、左、中央、右から選択します。 ● 外枠のサイズ（B） 表を取り囲む外枠の太さをピクセル数で指定します。 ● セル内のスペース（D） セル内での文字と枠線との間の隙間をピクセル数で指定します。 ● 罫線のサイズ（S） 枠の太さをピクセル数で指定します。 「最小幅」 ● 幅の指定（W） 表の幅をピクセル数または、表示画面の大きさに対する比率（％）で指定します。 「ユーザー設定の背景」 ● 背景の画像を使用する（I） 表の背景に画像を使う場合にはここで指定します。 （＊ IE3.0以上またはネットスケープ4.0以上の機能です） ● 背景の色（C） 表の背景の色を指定します。 「ユーザー設定の色」 （＊外枠のサイズが1以上の時に指定できます） ● 罫線 罫線の色を指定します。 （＊ IE3.0以上またはネットスケープ4.0以上の機能です） ● 明るい罫線 罫線の明るい部分の色を指定します。 （＊ IE4.0以上の機能？です） ● 暗い罫線 罫線の影の部分の色を指定します。 （＊ IE4.0以上の機能？です）
「レイアウト」
● 配置（L） 表の画面での位置を標準、左、中央、右から選択します。 ● 外枠のサイズ（B） 表を取り囲む外枠の太さをピクセル数で指定します。 ● セル内のスペース（D） セル内での文字と枠線との間の隙間をピクセル数で指定します。 ● 罫線のサイズ（S） 枠の太さをピクセル数で指定します。
「最小幅」
● 幅の指定（W） 表の幅をピクセル数または、表示画面の大きさに対する比率（％）で指定します。
「ユーザー設定の背景」
● 背景の画像を使用する（I） 表の背景に画像を使う場合にはここで指定します。 （＊ IE3.0以上またはネットスケープ4.0以上の機能です） ● 背景の色（C） 表の背景の色を指定します。
「ユーザー設定の色」 （＊外枠のサイズが1以上の時に指定できます）
● 罫線 罫線の色を指定します。 （＊ IE3.0以上またはネットスケープ4.0以上の機能です） ● 明るい罫線 罫線の明るい部分の色を指定します。 （＊ IE4.0以上の機能？です） ● 暗い罫線 罫線の影の部分の色を指定します。 （＊ IE4.0以上の機能？です）
セル一つ一つに関する設定を ［セルのプロパティ］ から行うことができます。 ［セルのプロパティ］は設定したいセルをポイントして ［右クリック］→［セルのプロパティ］ で表示できます。このとき、複数のセルを選択して一度に設定変更することもできます。
セル一つ一つに関する設定を ［セルのプロパティ］ から行うことができます。
［セルのプロパティ］は設定したいセルをポイントして ［右クリック］→［セルのプロパティ］ で表示できます。このとき、複数のセルを選択して一度に設定変更することもできます。
セルのプロパティ
「レイアウト」 ● 横位置（Z） セル内の文字や画像の横方向の位置を指定します。 ● 縦位置（V） セル内の文字や画像の縦方向の位置を指定します。 ● 見出しセル（D） チェックするとセル内の文字が太字になります。 ● 折り返ししない（N） チェックするとセル内の文字を、改行や段落変え以外では折り返さないようになります。 「最小幅」 ● 幅の指定（W） セルの幅をピクセル数または、表示画面の大きさに対する比率（％）で指定します。 「ユーザー設定の背景」 ● 背景の画像を使用する（I） セルの背景に画像を使う場合にはここで指定します。 （＊ IE3.0以上またはネットスケープ4.0以上の機能です） ● 背景の色（C） セルの背景の色を指定します。 「ユーザー設定の色」 （＊外枠のサイズが1以上の時に指定できます） ● 罫線 そのセルの罫線の色を指定します。 ● 明るい罫線 そのセルの罫線のうち明るい部分の色を指定します。 （＊ IE4.0以上の機能？です） ● 暗い罫線 そのセルの罫線のうち影の部分の色を指定します。 （＊ IE4.0以上の機能？です） 「セルのスパン」 （＊スパンとはセルが縦や横にまたがることをいいます） ● 行方向のスパン（R） そのセルが縦方向にいくつまたがるかを指定します。 ● 列方向のスパン（C） そのセルが横方向にいくつまたがるかを指定します。
● 横位置（Z） セル内の文字や画像の横方向の位置を指定します。 ● 縦位置（V） セル内の文字や画像の縦方向の位置を指定します。 ● 見出しセル（D） チェックするとセル内の文字が太字になります。 ● 折り返ししない（N） チェックするとセル内の文字を、改行や段落変え以外では折り返さないようになります。
● 幅の指定（W） セルの幅をピクセル数または、表示画面の大きさに対する比率（％）で指定します。
● 背景の画像を使用する（I） セルの背景に画像を使う場合にはここで指定します。 （＊ IE3.0以上またはネットスケープ4.0以上の機能です） ● 背景の色（C） セルの背景の色を指定します。
● 罫線 そのセルの罫線の色を指定します。 ● 明るい罫線 そのセルの罫線のうち明るい部分の色を指定します。 （＊ IE4.0以上の機能？です） ● 暗い罫線 そのセルの罫線のうち影の部分の色を指定します。 （＊ IE4.0以上の機能？です）
「セルのスパン」 （＊スパンとはセルが縦や横にまたがることをいいます）
● 行方向のスパン（R） そのセルが縦方向にいくつまたがるかを指定します。 ● 列方向のスパン（C） そのセルが横方向にいくつまたがるかを指定します。
セルを挿入したり分割したり、結合したりすることもできます。 ● セルの挿入 セルを選択して ［表（A）］→［セルの挿入（L）］ を選ぶと右側に新しいセルが挿入されます。 ● セルの分割 分割したいセルをポイントして ［表（A）］→［セルの分割（S）］ を選びます。分割する方向と、いくつに分割するか（列数）を選んで［OK］を押します。 ● セルの結合 ［Ctrl］キー＋［Alt］キー＋［クリック］ で結合したいセルをすべて選択して、［表（A）］→［セルの結合（M）］ を選ぶと、選択されたセルが一つに結合されます。
セルを挿入したり分割したり、結合したりすることもできます。
表は設定できる項目がたくさんありますが、すべてを覚える必要はありません。基本的な指定だけマスターしておきましょう。 さて、次はアンケートなどを作るときに使う 「フォーム」 についてです。
表は設定できる項目がたくさんありますが、すべてを覚える必要はありません。基本的な指定だけマスターしておきましょう。
さて、次はアンケートなどを作るときに使う 「フォーム」 についてです。
を押して、必要な大きさを選びます。
に変わるところでクリックします。マウスをクリックしたままドラッグすると複数の行を選択できます。
に変わるところでクリックします。マウスをクリックしたままドラッグすると複数の列を選択できます。
