画像を表示する 【<img>】

ブラウザで表示した時の見え方

薔薇

ソースサンプル(HTML)

<img src="./img/rose.gif" alt="薔薇" width="200" height="140">

ソースサンプル(XHTML)

<img src="./img/rose.gif" alt="薔薇" width="200" height="140" />

[ 黒※説明中のタグ 紫※省略可能なタグ 赤※変更可能 緑※文章など ]

解説

オプション
src画像ファイル名画像ファイルをを指定する<img src="./rose.gif">
alt代替テキスト画像のかわりに表示するテキストを指定する<img src="./rose.gif" alt="薔薇">
hspace
(※1)
ピクセル画像の横方向の余白を指定する<img src="./rose.gif" hspace="5">
vspace
(※1)
ピクセル画像の縦方向の余白を指定する<img src="./rose.gif" vspace="5">
widthピクセルまたは%画像の横の表示サイズを指定する<img src="./rose.gif" width="200">
heightピクセルまたは%画像の縦の表示サイズを指定する<img src="./rose.gif" height="140">
border
(※1)
ピクセル画像の周りの枠の太さを指定する<img src="./rose.gif" border="1">
align
(※1)
top
middle
bottom
left
right
画像の上部、
中央、
下部(初期値)に表示
画像を左端、
右端に寄せてテキストを逆に表示
<img src="./rose.gif" align="top">
属性名機能