(7)テーブルを使ったレイアウト

テーブルの効用:

☆ テーブル(表)は一般にデータを枠のある表の中に入れて整理する役割を持ちますが、Webページでは
  ページ全体を美しく見せる大事な役割を果たします。

☆ 即ち、HTMLタグではページに収められる内容の配置に関しては余り正確な役割を果たしてくれませ
  ん。 その弱点を補うのがこのテーブルの重要な役割なのです。

☆ ページの中でテキストのインデントを作成者の意図通りに見せたり、画像を正確にどの位置に配置
  するかはこのテーブルの設計に掛かっています。

簡単なテーブルを作るには:

(1) 編集しようとする頁をez-HTMLの編集画面に表示します。

(2) その頁の中のテーブルを配置したい場所をクリックして指定します。

(3) ez-HTMLの画面で上段の4段目のツールの種類を選ぶタブで「表」(テーブルのこと)をクリックす
   る。すると、上の図で示すように5段目にテーブルに関する6つのツール・ボックスが表示されます。

(4) そこで、左から2番目のツール・ボックスをクリックすると、テーブルを規定する為のダイアログが表
   示されます。

(5) そのダイアログのには「レイアウト」タブと「デザイン」タブの2つのタブが用意されています。 

(6)「レイアウト」タブを選ぶと、作ろうとするテーブルの「行と列の数」を(3X2のように)、「縦と横のサイ
   ズ」を(縦800ピクセルのように)、または「テーブルの配置」を(中央揃えのように)規定できます。

(7) 「デザイン」タブを選ぶと、作ろうとするテーブルの背景の色とか枠線の太さや色などを規定すること
   が出来ます。

(8) 全ての規定が終わった後、「貼り付け」ボタンをクリックすると、以下のようなテーブルのタグが生成さ
   れます。

(9) 一旦テーブルが作成された後、そのテーブルの属性を変更するには、このレッスンの(4)章の編集
    の頁で説明したと同じように、手作業で属性の変更が出来ます。 その場合、タグの内部にカーサ
    ー・ポイントを置き、半角英数字でスペースを挿入すると、プルダウン・メニューで属性の候補リスト
    が表示されるので、それを利用すると便利で入力ミスを防ぐことが出来ます。

<table width="800" alighn="center" border="1" cellspacing="2" cellpadding="0">
 
<tr> <td></td>
   
<td></td>
 
</tr>
 
<tr> <td></td>
    
<td></td>
 
</tr>
 
<tr> <td></td>
    
<td></td>
 </tr>
</table>

テーブルにテキストや画像を入れるには:

テーブルの各セルは<td></td>で表されるので、その2つのペア・タグの間にテキストや画像を貼り付けて行けば良いのです。

ツール・ボックスの詳細を知るには:

 ez-HTMLには色々便利なツール・ボックスが用意されています。それらは必ずしもいちいち覚えておられません。万一忘れた場合は画面2段目のメニュー・バー中ほどの「標準」メニューをクリックすると、それらのボタンと機能の対比がプルダウン・メニューで表示されますので、詳しい点は忘れても何ら問題はありません。