画像の横に文章を配置する

何も指定をせずに画像の後に文章を書くと、画像は左寄りに配置されその下に文章が来ますが、この配置を変える方法です。

「新しく記事を書く」→「ファイルのアップロード」→「（該当ファイルの）記事を書く」をクリックすると、下記のようなタグが挿入されます。

<a href="http://blog-imgs-13.fc2.com/a/a/a/aaadesign/sky.jpg" target="_blank"><img src="http://blog-imgs-13.fc2.com/a/a/a/aaadesign/sky.jpg" alt="sky.jpg" border="0"></a><br clear="all">

これに、この色の部分を書き加えます。前に半角スペースが必要です。そして、<br clear="all">の前に右に配置したい文章を書きます。

<a href="http://blog-imgs-13.fc2.com/a/a/a/aaadesign/sky.jpg" target="_blank"><img src="http://blog-imgs-13.fc2.com/a/a/a/aaadesign/sky.jpg" alt="sky.jpg" border="0" style="float: left; margin-right: 10px;"></a>ここに文章<br clear="all">

こんな感じになりましたか？ margin-right: 10px;は、画像の右側に余白を作るためです。

反対に、 style="float: right; margin-left: 10px;"とすると画像は右に寄り、文章は左に配置されます。

FC2ブログ開設 >>