| TOP | 基本 Webページ作成 | 基本 背景 | 基本 テキスト | 基本 テキスト装飾 |
| 基本 イメージ挿入 | 基本 イメージと文字列 | 基本 ハイパーリンク | 基本 テーブル | スタイルシートとは |
簡単!ホームページ作成


基本 イメージ挿入

インラインイメージの挿入してみましょう。Webページ内で使用できる画像は、GIFファイルとJPGファイルの2種類です。

1.画像の貼付

<img src=”●” alt=”◎”>~<body> ●=画像ファイルのパスとファイル名 ◎=画像のタイトルや説明文
<body>タグにtext,link,alink,vlink属性を加えるとWebページに使用する標準の文字色を設定できます。

・<img>

画像の貼付に使用するのは<img>タグです。必ず画像ファイルの位置(パス)と併せて使用します。

・src属性

表示させたい画像ファイルを指定します。画像ファイルが同じディレクトリ(フォルダ)にある場合はそのまま画像ファイルの名前を記述。別のディレクトリにある場合は、相対パスもしくは絶対パスを記述します。

・alt

画像を表示できないもしくは表示しないブラウザのために、alt属性で画像の代わりになるタイトルや説明文を設定します。

・例

「images」フォルダにある「img_04.jpg」「タイトル=サンプル1」という画像を挿入する場合。
<img src=”images/img_04.jpg” alt=”サンプル1” />と記述します。

サンプル1

2.画像サイズの指定

<img src=”●” width=”◎” height=”■”> ●=画像ファイルのパスとファイル名 ◎=画像の幅を指定するピクセル数 ■=画像の高さを指定するピクセル数

・width属性、height属性

貼り付ける画像のサイズを指定します。width属性で画像の横幅、height属性で画像の高さをピクセル数などを使って指定します。
注:)ただし、元が小さいサイズの画像をタグの記述で大きく指定した場合、画質がぼやけて悪くなります。また、大きい画像をタグの記述で小さく指定した場合、表示されるサイズは小さくなっても、もとの写真のサイズは変わらないので、ファイルサイズは大きいままです。
タグだけでサイズを変更することはしないようにしましょう。画像のリサイズはフォトショップなどの編集ソフトでリサイズしたのち、タグに記述するようにします。




◆協賛リンク 特17 6/4