画像の回り込み表示のサンプル - HTMLサンプル集

TOP > HTMLサンプル集（画像に関するタグのサンプル集） > 画像の回り込み表示のサンプル

このサンプルでは、段落の左側か右側に画像を回り込ませて表示させる方法をデモンストレーションします。

※このサンプルは、javascriptがONになっていないと動作しません

HTMLサンプル編集フィールド
HTMLソースコードをあなた自身で編集することができます。
<html> <body> <p> <img src ="sample_image_02.gif" align ="left" width="48" height="48"> 画像を含んだ段落です。画像のalign属性は、「left」がセットされています。画像はこの文章の左側に表示されます。画像を含んだ段落です。画像のalign属性は、「left」がセットされています。画像はこの文章の左側に表示されます。画像を含んだ段落です。画像のalign属性は、「left」がセットされています。画像はこの文章の左側に表示されます。 </p> <p> <img src ="sample_image_02.gif" align ="right" width="48" height="48"> 画像を含んだ段落です。画像のalign属性は、「right」がセットされています。画像はこの文章の右側に表示されます。画像を含んだ段落です。画像のalign属性は、「right」がセットされています。画像はこの文章の右側に表示されます。画像を含んだ段落です。画像のalign属性は、「right」がセットされています。画像はこの文章の右側に表示されます。 </p> </body> </html>

HTMLリアルタイム表示結果
編集されたHTMLソースコードの結果をリアルタイムで表示します。

文章内での画像の位置の設定サンプル

画像のサイズ設定のサンプル

画像に関するタグのサンプル集のコンテンツ