ホームページの作成（ホームページビルダー6）
前へ　目次へ　次へ

　２．画像の表示

　最初のページに画像を貼り付ける。

操作1 文章「次にイメージを貼り付けます。」を追加する。

操作2 画像を貼り付ける。

　画像ファイルはsampleフォルダに用意されているはずであるが、なければ右図のイメージ上で右クリックしてメニューから「名前を付けて画像を保存(S)...」を選択する。画像ファイルはsampleフォルダ(sample2ではない)に保存する。
①　カーソルを行の先頭に移動する。
②　メニューから次のように選択する。
　　　　［挿入(I)］　→　［画像ファイル(I)］　→　［ファイルから(F)...］　　　　または、をクリックする。
③　ファイルを選択する。（→カーソル位置に画像が挿入される。）

 
　画像は、マウスでドラッグすれば自由に移動できる。

　HTMLソースは次のようになっている。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META name="GENERATOR" content="IBM WebSphere Homepage Builder Version 6.0.2.1 for Windows">
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<TITLE></TITLE>
</HEAD>
<BODY>
<H1>ようこそ　最初のページです</H1>
<P>初めて作る最初のホームページです。<BR>
基本的なタグだけで作成しています。<BR>
<IMG src="../sample/Sharjah.png" width="305" height="164" border="0">次にイメージを貼り付けます。</P>
</BODY>
</HTML>

　IMGタグのwidthは画像の幅、Heightは画像の高さを表している。なくてもよいが、指定した方がよい。※1
　borderは画像周囲の枠線の指定で、0で枠線なしである。

※1　画像サイズ（属性width, Height）を指定する。
　ブラウザ（ホームページ閲覧ソフト）はHTMLソースを先頭から順に読み込んで表示していく。このとき、文字データはタグの指示にしたがって編集して表示される。画像は別のファイルとして用意されているので、HTMLソースを読み込んだだけでは表示できない。このとき、ブラウザは画像の表示場所だけ用意して残りの文字データを表示する。表示場所を用意するとき、画像のサイズがわからなければ最小のサイズで用意される。続いて、画像データが読み込まれ表示されるが、このとき表示場所が画像サイズの大きさになる。多くの画像がある場合、まれに正しいサイズにならずに画像が重なったり、一部が表示されなかったりする。
　IMGタグでサイズを指定しておけば、画像の表示場所を用意するときに指定されたサイズで用意されるので、このような現象を防ぐことができる。


前へ　目次へ　次へ
 ホームページの作成（ホームページビルダー6） Copyright © 2002 Hiroshi Masuda

 

 

inserted by FC2 system