スタイルシートで画像の回り込みを指定してみよう

 スタイルシートを使って画像の回り込みをしてみよう。

 通常、画像とテキストの関係は、下のようになる。

画像の回り込みを行わない場合

無料ソフト&無料サービス この状態が画像の回り込みをしていない状態。
 段落を指定すると、画像の下にテキストが配置される。

 

画像の回り込みを指定した場合

無料ソフト&無料サービス これが、画像の回り込みを指定した状態の表示。

 画像の右側(画像そのものは、左側)にテキストが配置される。

 HTMLの記述は、
<p><img style="WIDTH: 80px; HEIGHT: 355px" border="1" alt="無料ソフト&amp;無料サービス"
align="left" src="http://blog-imgs-54.fc2.com/f/s/o/fsohuto/201207031857041a3.jpg"
width="80" height="355"> これが、画像の回り込みを指定した状態の表示。</p>
<p> 画像の右側(画像そのものは、左側)にテキストが配置される。</p>

 という形になる。

 画像の位置を右側にしたい場合、align="right"

 画像が続く限り、回り込みの指定は続く。

 回りこみを解除したい場合、<P class="f-clear">で段落を指定する。

コメントを残す




*

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

関連記事

アドホックモードを解除する方法・Windows7

アドホックモードを解除する方法・Windows7

noimage
noimage
noimage

Googleアドセンスの検索ボックスが文字化けしていた

noimage
noimage
noimage

Yahoo!ID流出被害確認ツール

noimage

Windows7インストール後のライセンス認証であわてない

noimage
noimage
noimage

スマートフォンがウイルスに感染するとどうなる?

noimage

Baidu(百度)発hao123の解除方法

noimage

Xperia(TM) acro HD SO-03D はdocomoOnlineShopが安いかも

noimage

OpenOffice.org Calcのシートの名前を変更してみよう

noimage

Web版家計簿の決定版というと、MoneyLook

Menu

HOME

 TOP