初心者のためのHTML入門講座

画像の右側に文章を回り込ませるには

画像の右側のスペースが空いているのが気になる場合は、画像の右側に文章をまわりこませることができます。その場合には次のような指定をします。

<p>< img src=”3-4-19.jpg” alt=“見本画像” align=”left” ></p>

つまり、先の画像を表示させるタグの属性に「align=”left”」を書き込めばいいだけです。こうする事で画像が左側に、文章が右側に表示できます。

では書き込んでください。そして、上書き保存してから、HTMLファイルの「更新」ボタンを押してください。うまく表示されましたか。表示された画像と文章を見ると、画像と文章の間が狭く窮屈な感じがしませんか。その場合は、下のような指定をします。

<p> <img src=”3-4-19.jpg” alt=“見本画像” align=”left” vspace=”12” hspace=”15”></p>

この場合も「vspace=”12” hspace=”15”」を書き込めばいいだけです。スペースの数字はピクセル数を表しています。ブラウザ画面を見て、お好みで指定してください。「vspace」は画像の上下にスペースが空き、「hspace」は画像の左右にスペースが空きます。

基本的なHTMLファイルから始まって、いくつかのタグや属性、値などを入力してきましたが、このような画面が表示されていますか。意外と簡単だったのではないでしょうか。
HTML編集は、ここまででいったん終了します。タグはこのほかにもたくさんあります。この程度だったら手に負えると思ったら、本や他のサイトなどを見て憶えていってくださいね。


次の項目→ホームページを公開するには