画像を表示させる
画像を表示させる必要なタグは以下の通りです。
<img src="images/img.gif" width="87" height="64" alt="犬です" border="0">
と記述します。『src=""』の中に表示させたいパスを指定します。この場合『images』フォルダの中の『img.gif』を指定しています。ファイルのパス、階層が分からない人は右メニューの『階層』という所で詳しく説明していますので、ご覧ください。上記のタグで表示させると以下の通りになります。
画像のサイズ
画像のサイズを決めます。『width』が横幅、『height』が縦幅を意味しています。
<img src="images/img.gif" width="87" height="64" alt="犬です" border="0">
また、画像のサイズ指定は行わなくても表示はされます。ですが記述しておく事により画像の表示が早くなりますので、記述する事を強くお薦めします。その他に記述しておくと表示分の領域が確保されるので、表示されなかった時のレイアウトの崩れを防いでくれるメリットもあります
| 幅指定無し | 幅指定有り |
![]() | ![犬です]() |
説明文
画像の説明文を記述します。これにより、マウスを乗せた時に説明文が表示されます。
<img src="images/img.gif" width="87" height="64" alt="犬です" border="0">
これも、記述しなくても表示させる事ができます。ですが記述しておく事により、サーバーの都合により、リンクが切れた時など説明文を出せるという利点があります。
| alt 無し | alt 有り |
![]() | ![犬です]() |
外枠
画像にリンク指定をした時、枠の指定をしていないと、このように表示されます。
このように枠線が表示されるとカッコ悪いので、以下の通りにして枠線を消します。
<img src="images/img.gif" width="87" height="64" alt="犬です" border="0">
色々画像の記述の説明をしてきましたが、基本的には紹介したタグをそのまま記述する方が良いでしょう。
画像の位置
画像の位置は基本的に文字の位置と同じになりますので簡単に説明します。
<div align="center">
<img src="images/img.gif" width="87" height="64" alt="犬です" border="0">
</div>
『center』で中央、『right』で右、『left』で左に指定すればこのように表示されます。
