画像に枠線を入れ離す方法

質問

画像に一つひとつに枠線を入れ、下記のように離して表示
したいのですが、使用する画像の数が多いのでdivを使うと
嵩張ります。

ソースを汚さず表現するにはどうすればいいのでしょうか？
よろしくお願いします。

　□　□　□　□

　□　□

回答No.1

4649panda · ベストアンサー

CSSで、#box_aに画像が入っている場合、

#box_a img {
margin-right: 5px; /*枠線と枠線の水平方向の余白*/
margin-bottom: 5px; /*枠線と枠線の垂直方向の余白*/
padding: 5px: /*枠線と画像の間の余白*/
border: 1px solid #ff0000; /*枠線のスタイル*/
}

こんな感じでどうですか？
数値は好きな範囲でいいです。
IEの場合は、標準モード(DOCTYPE 宣言)にしないと使えないと思います。

お礼

出来ました。
4649pandaさん、回答ありがとうございました。