画像を使った記事作成(3)
[5]ワンポイント
この例では(そしてここの説明でも)画像の文字回り込みをすべて左回りにしました。ぶろぐの設定で、200px×200pxより大きな画像はサムネイルで200pxに縮小して挿入されるので、通常はどっちかの回り込みを使うと凝った記事を作成することができます。面倒なら「無し」でも何の問題もありません。
で、その「面倒」な部分ですが、普通に窓からどんどん挿入していくと間に文章を入れても

こうやって1枚目の画像で文章を入力して普通に「改行」しても

こんな風に画像が繋がってしまったりします。
これは、2枚目の画像が、実は文章の続きに挿入されているから起こる現象で、これを避けるには空改行で画像の下位置になるまで強引に改行してしまうか、次のように明示的に「画像が終わるまで改行」するんだよ、と指定してやる必要があります。タグ使いには馴染みのテクなので、おまじないとして覚えておくといいでしょう。
……入力して普通に「改行」しても< clear="all">

こうやって1枚目の画像で文章を入力して普通に「改行」しても

このようにちゃんと画像が配置できます。
まあ、画像を横に並べるとかいう場合とか、レイアウトのイメージによっては逆にこの仕様を利用することもあるので、いろいろ試してみるといいです。
この例では(そしてここの説明でも)画像の文字回り込みをすべて左回りにしました。ぶろぐの設定で、200px×200pxより大きな画像はサムネイルで200pxに縮小して挿入されるので、通常はどっちかの回り込みを使うと凝った記事を作成することができます。面倒なら「無し」でも何の問題もありません。
で、その「面倒」な部分ですが、普通に窓からどんどん挿入していくと間に文章を入れても

こうやって1枚目の画像で文章を入力して普通に「改行」しても

こんな風に画像が繋がってしまったりします。
これは、2枚目の画像が、実は文章の続きに挿入されているから起こる現象で、これを避けるには空改行で画像の下位置になるまで強引に改行してしまうか、次のように明示的に「画像が終わるまで改行」するんだよ、と指定してやる必要があります。タグ使いには馴染みのテクなので、おまじないとして覚えておくといいでしょう。
……入力して普通に「改行」しても< clear="all">

こうやって1枚目の画像で文章を入力して普通に「改行」しても

このようにちゃんと画像が配置できます。
まあ、画像を横に並べるとかいう場合とか、レイアウトのイメージによっては逆にこの仕様を利用することもあるので、いろいろ試してみるといいです。
| 管理::使い方 | 07:00 PM | comments (0) | trackback (0) |

