第３章　ホームページの作成

今日の研修内容

課題２３　ホームページに作成した「表」に画像を貼り付けるには？

　ホームページに表を作成して「文字や数字」を貼り付ける方法はわかりましたね。では、画像データを表に組み込む方法について研修しましょう。

---

＜手順＞

（１）画像ファイルのコピー

• 通信講座メールに添付されている201.jpg、301.jpg、401.jpgをフロッピィに複写します。
  （201.jpgは岐阜市少年センター、301.jpgは各務原市視聴覚センター、401.jpgは大垣市教育研　究所の画像です）

（２）イメージの貼り付け

• 「メモ帳」を開きます。「ファイル」「開く」（すべてのファイル）を選択し、「3.5インチFD」の中にある「sample4.htm」を指定します。
• 下のように書き加え、「ファイル」「上書き保存」を選択します。

<TABLE BORDER> <TR><TD>機関名</TD><TD>所在名</TD><TD>電話番号</TD><TD>画像</TD></TR> <TR><TD>岐阜市少年センター</TD><TD>岐阜市今沢町１８</TD><TD>０５８−２６２− ９９５４</TD><TD><img src="201.jpg"></TD></TR>

（３）表示

• 「ネットスケープナビゲータ」を起動します。「接続」はキャンセルし、「ファイル」「開く」「3.5インチFD」を選択し、「sample4.htm」を開きます。

（演習）同様に、301.jpgと401.jpgの画像を表の中に貼り付けよう。

ワンポイントアドバイス 　画像の大きさ（比率）を変えるには、WIDTH="200" HEIGHT="150"のように数字を変えます。しかし、横200：縦150の比率は一定にしないと、画像がゆがんで表示されてしまいます。

＜まとめ＞

　テーブルタグ（<TABLE BORDER>、<TR>、<TD>）を使って、画像だけでなく文字を囲むいろいろな枠を作ることもできます。ただ、画像を貼り付ける場合には、画像サイズが同じではないので、WIDTHやHEIGHTで表示するサイズを設定します。

＜キーワード＞ 　　<IMG SRC="**.*" WIDTH="***" HEIGHT="***"> 　画像を表示するタグ

　

作成者	宇野芳彦
所　属	上之保東小学校

▲目次へ戻る｜▼次の課題へ進む