|
テキストや画像の垂直の余白を設定する
|
|
|
画像とテキストや、画像と画像の、垂直の空白を指定する 10進数(整数)で指定
IE 拡張機能で、HTMLでの指定は
非推奨とされ
STYLEで指定を推奨しています。
|
<img src="
画像URL"
vspace="
上下の余白
">
|
|
|
|
画像と、画像の上下にマージンを指定したサンプル。
画像と画像にマージンが適用され表示されている。
<img src="hasi.gif" alt="
明石海峡大橋の写真です"
width="100" height="60"
vspace="50"
>
<br>
<img src="ok02s.gif" alt="
マーメード号の夜景写真です"
width="100" height="60">
|
|
|
|
|
|
| 画像と画像に間隔がなく表示されている。
画像と画像にマージンを無指定の表示。
<img src="hasi.gif" alt="
明石海峡大橋の写真です"
width="100" height="60">
<br>
<img src="ok02s.gif" alt="
マーメード号の夜景写真です"
width="100" height="60">
|
|
|
|
|
|
| 上下間隔を空ける バリエーション、 サンプル表示例
改行しないで、横間隔も指定しています。
<img src=
"hasi34s.gif" alt=
"明石海峡大橋の写真です"
width="100" height="60"
hspace="10"
>
<img src=
"ok02s.gif" alt=
"マーメード号の夜景写真です"
vspace="20"
width="100" height="60">
|
|
|
|
|
IMG
関連タグ 解説
関連
URL
IMG関連 TAG
| 属性 |
語源 |
読みかた |
説明 |
|
hspace
|
horizontal space
|
エイチスペース
|
水平であるサイズの意味
JAVA アプレット、画像、オブジェクトの文書中の水平方向の余白スペースを指定。
|
|
vspace
|
vertical space
|
ヴィスペース
|
垂直であるサイズの意味
JAVA アプレット、画像、オブジェクトの文書中の垂直方向の余白スペースを指定。
|
|
|
|
|
HTML TAG
|
|
詳 細
| |
|---|
|
<img >
|
要 素
|
画像を表示する
属性、属性値は
要 素
括弧内に設定する。
|
空要素 終了タグなし
|
|
src=""
|
属 性
|
場所の属性 括弧内に画像のファイル名を設定する セットで省く事は出来ない
|
<img >
|
|
hspace=""
|
属 性
|
画像の横間隔を空けて表示するHTMLタグです
|
<table> <th>
<tr>
<td> <img>
|
|
vspace=""
|
属 性
|
画像の縦間隔を空けて表示 表と文字との間に余白を入れる
HTMLタグ 横間隔(10進数整数)で指定
|
<table> <th>
<tr>
<td> <img>
|
|
参考 スタイルでの指定
上下・左右のマージン 詳細は、スタイル講座で。
<img src="
画像URL"
style="margin-top:10px; margin-bottom:10px;"
> <br>
<img src="
画像URL"
style="margin-top:10px; margin-bottom:10px;"
>
|
パディング 指定例
マージン
マージンはボーダーの外側の余白
margin: 1px 2px 3px 4px; /* 上=1px、右=2px、下=3px、左=4px */
マージン
margin-top: 1px;
margin-bottom:1px;
margin-left:1px;
margin-right:1px;
パディング
ボーダーの内側の余白になります。
padding: top 1px;
padding-top: 1px;
padding-bottom: 1px;
padding-left: 1px;
padding-right: 1px;
|
|
|
|
|
|
|