ＨＴＭＬ応用編　文字の回り込み

画像の文字回り込みにはalign属性を付加する方法が容易です。
しかし、多くのアフィリエイト広告では、タグの改変が不可となっており、実用的ではありません。
そこで、ここではタグの改変を行わないで、文字を回りこませる方法を取り上げます。
　⇒ align属性についてはこちら

表タグ「table」を使う方法が、一番簡単で気軽な方法だと思います。
　⇒ tableタグについてはこちら

回り込みをさせるスタイルに float があります。
こちらは、align の代替となるスタイルシートです。
SEO、ユーザービリティを考えるとfloatがtableよりも優位なようです。

【サンプルコード】

<div style="float:left;">画像タグ</div>
回り込み文章<br clear="all">

left 右に回り込み、right 左に回りこみ
（サンプルは画像を左、回り込み文章を右に表示）
文字との余白を空けたい場合は、margin、paddingを使用。
　⇒ margin、padding についてはこちら

表示する画像全てに回り込みを指定する方法があります。
スタイルシートをうまく設定するとタグの簡潔化・管理の便利さがあります。
SEOとしてはこの方法が一番優位そうです。
指定ブロックの画像タグだけ適用する方法もあります。

【サンプルコード】

スタイルシート
　　img { float:left; }

本文部分はそのまま記入

left 右に回り込み、right 左に回りこみ
指定ブロックのみに適用する場合は、スタイルシートコードの前方にclass属性などを与えることで実現できます。
（例）.ali img { float:left; }
クラス名 ali の中にある画像のみfloatを適用。（詳細は専門書籍・サイトで）
文字との余白を空けたい場合は、margin、paddingを使用。
　⇒ margin、padding についてはこちら