画像回り込み(float)
<html> <head> <title>画像回り込み</title> <style type="text/css"> <!-- .img1 { float: left; /*画像左寄せ、右側に回り込み*/ } .img2 { float: right; /*画像右寄せ、左側に回りこみ*/ } .clr { clear: both; /*回り込み解除*/ } //--> </style> </head> <body> <img src="../../sample/img/img.jpg" class="img1"> 【画像を左寄せ、テキストは右側に回り込み】<br> 画像を左寄せ、テキストは右側に回り込み。 画像を左寄せ、テキストは右側に回り込み。 画像を左寄せ、テキストは右側に回り込み。 画像を左寄せ、テキストは右側に回り込み。 画像を左寄せ、テキストは右側に回り込み。 画像を左寄せ、テキストは右側に回り込み。 画像を左寄せ、テキストは右側に回り込み。<br> 画像を左寄せ、テキストは右側に回り込み。<br> 画像を左寄せ、テキストは右側に回り込み。<br> 画像を左寄せ、テキストは右側に回り込み。<br> 画像を左寄せ、テキストは右側に回り込み。<br> 画像を左寄せ、テキストは右側に回り込み。<br> <br class="clr"> <br> <img src="../../sample/img/img.jpg" class="img2"> 【画像を右寄せ、テキストは左側に回りこみ】<br> 画像を右寄せ、テキストは左側に回りこみ。 画像を右寄せ、テキストは左側に回りこみ。 画像を右寄せ、テキストは左側に回りこみ。 画像を右寄せ、テキストは左側に回りこみ。 画像を右寄せ、テキストは左側に回りこみ。 画像を右寄せ、テキストは左側に回りこみ。 画像を右寄せ、テキストは左側に回りこみ。<br> 画像を右寄せ、テキストは左側に回りこみ。<br> 画像を右寄せ、テキストは左側に回りこみ。<br> 画像を右寄せ、テキストは左側に回りこみ。<br> 画像を右寄せ、テキストは左側に回りこみ。<br> 画像を右寄せ、テキストは左側に回りこみ。<br> </body> </html>
〔 実行する 〕