実践!ホームページでこんな事がしたい


画像の横に文字を表示させたい
画像の横に文字を表示させてみましょう。
デッドスペースを有効に活用出来ます。
デザイン的にも少し使えますね〜^^)
スタイルシートで回り込み指定を使います。
簡単に出来るので試してみてください。
下で簡潔に説明します。

HOME BACK

通常画像の横に文字をいれるとこんな感じ表示されます。

回り込みを使う事でデッドスペースが消えます。
こんな感じで表示させる事が出来ます。
便利でしょ?

<IMG src="girl-k01.gif" width="84" height="95" border="0" style="float:left;">回り込みを使う事でデッドスペースが消えます。<BR>
こんな感じで表示させる事が出来ます。<BR>
便利でしょ?

style"float:left;を指定する事で画像の位置を指定しています。
left right noneが存在します。
試しに上のleftの部分をrightに変更してみます。
   
回り込みを使う事でデッドスペースが消えます。
こんな感じで表示させる事が出来ます。
便利でしょ?

こんな感じで指定すればデッドスペースが有効に使えます。

HOME BACK
パソコン初心者講座ぱそおーる