枠線と画像の余白
昨日のパソコン学習会でTABLEをしたのだがこの中に画像を貼り付け、その枠線を額縁として表示する事を挑戦されておられた。
枠内に画像が入って場合と、枠と画像の間に空間がある場合が出来た。
その違いはは何処から来るのか試してみる。
kako335のブログを参考にしました。
この場合のタグは下記のようになっている。
<table border="10"><tr><td>画像ファイル名又はファイルのある場所のURL</td></tr></table>
しかし、分かりやすくするために [ENTER] キーを打って改行すると、ブログで表示すると余分な空白ができる場合がある。これは <p> タグが強制的に挿入されるためです。
TABLEタグを分かりやすくするために、次のような形で、ブログ記入欄にTABLEタグを書いて見た。
<table border="10">
<tr>
<td>
画像ファイル名又はファイルのある場所のURL
</td>
</tr>
</table>
この場合、画像と枠線の関係は下図のようになる.
- 一番簡単な方法:改行せずに下記のように連続で入れる。
<table border="10"><tr><td>画像ファイル名又はファイルのある場所のURL</td></tr></table>
- TABLE のはじめに > 、終わりに < をつける。
><table border="10">
<tr><td>画像ファイル名又はファイルのある場所のURL</td></tr>
</table><
- 上の方法を使って<div> タグで区切る。
><div>
<table border="10">
<tr><td>画像ファイル名又はファイルのある場所のURL</td></tr>
</table>
</div><