画像の周囲に文章を回りこませる

ここでは、「 画像の周囲に文章を回りこませる」 に関する記事を紹介しています。
◎ 画像の周囲に文章を回りこませて表示する

 このように、写真やバナーなどの画像を挿入し、そのまま文章を記述すると文章が画像の下に表示されてしまいます。この場合、<img>タグに「align 属性」を追加することで、文章を画像の右や左に回りこませて表示することができるようになります。

文章を画像の右に回りこませて表示 (表示例を兼ねる)

文章を画像の右に回りこませて表示画像の左右に文字を回りこませるには、画像を表す<img>タグに、
画像と文字の位置関係を表す「align 属性」を設定します。
ここでは、「align 属性」に「left」を指定しているので、
文章は画像の右側に回りこんで表示されます。
「left」を「right」にすれば、文章は画像の左側に回りこみます。

●記述例
<img src="画像へのパス(URL)"
alt="" border="0" align="left" style="padding-right:10px;">文章

 ※ align="left" ⇒ 画像を左側に指定する
 ※ style="padding-right:10px;" ⇒ 文章と画像の間隔を開ける

この記事へのコメント
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
この記事のトラックバックURL
http://weblog58.blog58.fc2.com/tb.php/54-179208ea
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック