画像の回りこみタグ

すっかり書くのを忘れてたのですが…【parent_and_child】以降にはスタイルシートに以下のものが入っていたりします。

img.left {
float:left;
clear:left;
margin:5px 10px 5px 0px;
padding:0px;
border: none;
}

これは画像の回りこみをして記事を書きたい場合に使用できるように入れた回りこみ用のタグです。（使用しない場合は削除しちゃってもOKです）
※回り込みとは、1個下（↓）の記事のように画像の横に文字が並ぶような設定のことです。このタグでは画像の右横に文字がくるようになってます。

画像と長い文章を組み合わせたりするのに相性がよいと思うのですが、使いたくないという方も多そうなので、普通に画像を記事に入れた場合は回り込みはしないようにしてあります。

回り込みをさせたい場合は、通常記事に挿入される画像のタグに
「left」というクラスを設定して頂ければ、クラスを設定された画像のみ回り込みをします。

【やりかた】

記事に画像を使うと通常挿入されるタグに
<a href="http://blog-imgs-23.fc2.com/t/m/p/tmpblog/xx.gif" target="_blank"><img src="http://blog-imgs-23.fc2.com/t/m/p/tmpblog/xx.gif" alt="" border="0"></a><br clear="all">
↓
<a href="http://blog-imgs-23.fc2.com/t/m/p/tmpblog/xx.gif" target="_blank"><img src="http://blog-imgs-23.fc2.com/t/m/p/tmpblog/xx.gif" alt="" border="0" class="left"></a><br clear="all">
赤い文字の部分を追加するダケです。

その際重要なのが <br clear="all"> このタグが回り込みをしたい文章の一番下にくるように記事を書くと、画像の縦の長さより短く文章が終わっても、<br clear="all">以降の文章は回り込みが解除された状態（画像の下から）で表示されるようになります。

<a href="http://blog-imgs-23.fc2.com/t/m/p/tmpblog/xx.gif" target="_blank"><img src="http://blog-imgs-23.fc2.com/t/m/p/tmpblog/xx.gif" alt="" border="0" class="left"></a>ここに画像の横に表示されたい文章を書く感じです。<br clear="all">ここから画像の下に表示されたい文章〜…

（回り込み画像にはボーダーが出ないようになっていますので、表示したい方はborder: none;の一行を削除してください）

一見めんどくさそうですが…回り込みを使いこなすと色々できて便利かと思います。
よかったら一度試してみてくださいませ〜

ちなみに一番上のスタイルシートを追加すれば、どのテンプレートでも同じことができると思います。（できなかったらゴメンナサイ）