画像イメージの上下左右、欲しいところに好きな間隔を入れられますか？

こんにちは。タイトルの通りサイト作成で、
画像の上下左右、好きな方向に間隔を入れられるかその方法をお教えください。

参考までに、DreamWeaver（ドリームウィーバー）2004MXです。

画像とテキストの兼ね合いで、画像の右側や左側に、
ところどころで間隔が欲しいと思っています。

間隔をいじれるところといえば縦間隔、横間隔になりますが、
縦間隔なら「上」と「下」、横間隔なら「右」と「左」、
これらが一度に動いてしまうのです。
片方には確かに欲しい間隔が得られるのですが、
ほう片方に要らない間隔ができてしまい困っています。

例えば右だけに間隔が欲しい。
左だけに間隔が欲しい。

こういう場合って、何かやり方があるのでしょうか。

もともと余白込みの画像を用意するという手も講じましたが、
その場合はその場合で、その画像が他のレイアウトに流用しづらい
という弱点を生んでしまい、レイアウトごとに画像を用意しなければならないので
対症療法としてはうまくいきませんでした。

また、画像ごとにセルを用意して任意の余白を作り出す手もありましたが、
セルがあまりにも絡まりあってしまい、
かなりぐちゃぐちゃなものになるためうまくいきませんでした。

やはりもうちょっと詳しい方にお訊きしようと思いまして
質問を立てさせていただきました。
素人質問で大変申し訳ありません。
どうぞ宜しくお願いいたします。

No.3 ベストアンサー 回答者： naokita 回答日時： 2009/03/13 12:29

HTMLの初歩です。

具体的には、
-------------------------------------------
<img src="○○.gif" width="100" height="100" alt="*"
style="margin: 10px 20px 0 30px;">

上10px　右20px　下0　左30px　の四方の隙間が開く。
数値は例なので適当に変更を。
-------------------------------------------

<img src="○○.gif" width="100" height="100" alt="*"
style="margin: 5px 20px;">
上下5px　右右20px　の2方の隙間が開く。

この回答へのお礼

naokitaさん、有難うございます。
この方法はどの画像にも個別に適用できて、実に快適なので、
大変参考になりました。
また、四方の順番は時計回りと覚えれば良いことも分かりました。
単位もpxなのですごく扱いやすいです。
丁寧なご回答、本当に有難うございました！

お礼日時：2009/03/14 02:14

No.2 回答者： askaaska 回答日時： 2009/03/13 10:51

marginやpaddingを使うといいわ。

marginは隣のものと距離を取るスタイルよ。
┌─┐┌─┐
│Ａ ││Ｂ │
└─┘└─┘
Ａの右にmarginを取ると
┌─┐ 　 ┌─┐
│Ａ │ 　 │Ｂ │
└─┘ 　 └─┘
になるわ。

paddingは余白を作るスタイルよ。
┌─┐┌─┐
│Ａ ││Ｂ │
└─┘└─┘
Ａの右にpaddingを取ると
┌──┐┌─┐
│Ａ 　 ││Ｂ │
└──┘└─┘
こうなるわ。

画像に余白を追加して、の処理に近いのはpaddingね。

この回答へのお礼

早速のご回答有難うございます。
図解でご説明いただけて大変参考になりました。
marginのほかに、paddingという概念もあったのですね。
今後、ますます学習していきたいと思います。
有難うございました！

お礼日時：2009/03/14 02:10

No.1 回答者： kura07 回答日時： 2009/03/13 10:41

marginを使いましょう。

margin-top(bottom,left,right)で、各方向への余白が制御できます。

参考URL：http://www.tagindex.com/stylesheet/img/margin.html

この回答へのお礼

早速のご回答有難うございました。
margin-top(bottom,left,right)などで制御するのですね。
早速取り入れてみたいと思います。
有難うございました！

お礼日時：2009/03/14 02:08