1. Home
  2. HTMLタグ
  3. イメージタグ
  4. 画像の周囲にスペースを入れる

画像の周囲にスペースを入れる


<img src="" alt="" hspace="" vspace="">

ブラウザ
IE
Fx
Sf
Cr
O
分類
インライン要素
空要素
非推奨属性
要素
img要素

img要素hspace=""vspace="" を追加すると、画像の周囲に余白を入れることができます。



<img src="sample.gif" alt="サンプル" hspace="10" vspace="10">


属性 説明
hspace="" ピクセル数 左右の余白を指定
vspace="" ピクセル数 上下の余白を指定

上記の属性は、HTML 4.01では非推奨とされています。(Strict DTDでは使用できません)

メモ

この指定内容はスタイルシートで代替することができます。指定方法の詳細は「関連ページ」をご覧ください。

以下の使用例では、align属性と組み合わせて使用しています。


使用例

■左右に30ピクセルの余白を指定した例


<p>
<img src="rainbow.jpg" alt="写真" align="left" hspace="30">
サンプルのテキスト。<br>
サンプルのテキスト。<br>
サンプルのテキスト。<br>
...
</p>

表示例

写真 サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。


■上下に30ピクセルの余白を指定した例


<p>
<img src="rainbow.jpg" alt="写真" align="left" vspace="30">
サンプルのテキスト。<br>
サンプルのテキスト。<br>
サンプルのテキスト。<br>
...
</p>

表示例

写真 サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。


■上下左右に30ピクセルの余白を指定した例


<p>
<img src="rainbow.jpg" alt="写真" align="left" hspace="30" vspace="30">
サンプルのテキスト。<br>
サンプルのテキスト。<br>
サンプルのテキスト。<br>
...
</p>

表示例

写真 サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。
サンプルのテキスト。


イメージタグ

ページの先頭へ


inserted by FC2 system