画像表示 <img src="xxx.jpg" …>

sample

サンプル

サンプル画像

img src="xxx"
画像を表示させるイメージタグ。

alt="xxx"
その画像をあらわす文字を入れます。画像が表示されない場合や、
画像の上にカーソルをのせた時に表示されます。(一部表示されないブラウザもあります)

width="数字"
画像の横幅。

height="数字"
画像の縦の長さ。

画像への回り込み解除 <br clear="xxx">

<img src="xxx.jpg" align="left" />
1.左側の画像・テーブルに対する
<br clear="left"> 回りこみ解除

<img src="xxx.jpg" align="right" />
2.右側の画像・テーブルに対する
<br clear="right"> 回りこみ解除

<img src="xxx.jpg" align="left" />
3.どちらの画像・テーブルに対する
<br clear="all"> 回りこみ解除

sample

1.左側の画像・テーブルに対する
回りこみ解除

2.右側の画像・テーブルに対する
回りこみ解除

3.右、もしくは左の画像・テーブルに対する
回りこみ解除

br clear="left"
align="left"で左寄せしている画像に対する回りこみ解除

br clear="right"
align="right"で右寄せしている画像に対する回りこみ解除

br clear="left"
align="right"でもalign="left"でもどっちでも解除可

画像間隔 <img src="xxx.jpg" hspace="xxx" vspace="xxx">

<img src="xxx.jpg">1.HTML│CSSタグ辞書 <img src="xxx.jpg" hspace="30">2.HTML│CSSタグ辞書 <img src="xxx.jpg" vspace="30">3.HTML│CSSタグ辞書

sample

1.HTML│CSSタグ辞書
2.HTML│CSSタグ辞書
3.HTML│CSSタグ辞書

img src="xxx.jpg" vspace="数字"
画像の上下の余白の設定

img src="xxx.jpg" hspace="数字"
画像の左右の余白の設定

イメージマップ <map name="xxx"><area shape="xxx">

<img src="xxx.jpg" usemap="#map_sample" border="0" alt="イメージマップサンプル">
<map name="map_sample"> <area shape="rect" coords="25,25,105,125" href="#" alt="四角形"> <area shape="circle" coords="160,50, 35" href="#" alt="円"> <area shape="poly" coords="240,51,285,129,195,129,240,51" href="#" alt="多角形"> </map>

sample

イメージマップサンプル 四角形 円 多角形

usemap="#☆"name="☆"で関連付けます。

area shape="xxx "
四角形なら="rect"、円なら="circle"、多角形なら="poly"

coords="数字"
座標を入力。

イメージマップ座標