画像の左右に余白を設ける

<img hspace=””>

画像に対して文字の回り込みなどを設定すると、画像に十分な余白がない場合、初期の状態では画像の文字が接近しすぎているように見えることがあります。この場合、画像に余白を挿入すると回避できます。

IMGタグに「hspace=””」という属性を追加し、ピクセルで余白を指定します。
同様に「vspace=””」を指定すると上下の余白も調整できます。

記述例

画像を左寄せにし、左右に20ピクセルの余白をつける<br><br>
<img src=”../../logo.gif” align=”left” hspace=”20″>
画像に対する文字の表示位置に注意。


画像を左寄せにし、左右に20ピクセルの余白をつける

HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード画像に対する文字の表示位置に注意。

スタイルシートでの設定が推奨されます。hspace属性はHTML5で廃止されました。

CSSのmarginプロパティで左右の余白を指定するのが通例です。

これ以外の画像に関するタグの指定方法や注意点は以下の関連情報を参考にしてください。

関連情報

【厳選】合わせて読みたいおすすめ書籍

WEB制作支援サイトのHTMLタグボードだからオススメできる厳選書籍です。私が読んでいない本はオススメしません。

HTMLやCSS、Webデザインを体系的に学ぶなら

最新のHTML5を学ぶなら

参考情報

最新情報をチェックしよう!