画像の右下に複数行の文字

質問

gooブログを利用しています。
画像の「右下」に、「複数行」の文章を回り込ませる方法を教えて下さい。
下記のようなイメージです。(■の部分が全部で1枚の画像です)

■■■■■■
■■■■■■
■■■■■■　　
■■■■■■ 文字文字文字
■■■■■■ 文字文字文字

色々探してみたのですが、
(1)leftのタグを使う「画像の右側(上から)複数行」
(2)bottomのタグを使う「右下側に1行のみ(？)」
しか見つかりませんでした。

タグの知識はあまりないので、これらを同時に使う事ができるのかとか(あるいはできないのでしょうか？)、分かりません。
どうぞご教示お願いします。

回答No.2

noname#57571 · ベストアンサー

厳密には回り込みとは違いますが、テーブルタグを使うとご希望通りの表示ができます。

<table><tr><td><img src="画像のURL"></td><td valign="bottom">文字列</td></tr></table>

* 注意： 途中で改行しないでくださいね。

この例では、表の中の左のセルに画像、右のセルに文字を入れています。「valign="bottom"」と指定する事で右セル内の文字が下寄せになります。この方法は、画像の説明用の短文を書く場合に適しています （ ^^

お礼

さっそくのお返事ありがとうございます。

コピーしてやってみたら、イメージ通りのものができました！

画像を2個並べて、その横に文字を配置したりもしたかったのですが、これもテーブルタグを使えばできそうですね！
どうもありがとうございました！

回答No.1

xenotactic

んー私だったら次のようにしてみると思います。
成功できるかはわかりませんが。

■■■■■■↑
■■■■■■｜ここの空白の高さを70pxとすると
■■■■■■↓　　
■■■■■■ 文字文字文字
■■■■■■ 文字文字文字

<img src="画像のURL" style="float:left;">
<p style="padding:70px 0 0 10px;float:right;">文字文字文字<br>文字文字文字</p>
<br style="clear:both;">

お礼

さっそくのお返事ありがとうございます。

教えていただいた方法、コピーしてやってみました。
なぜか画像と文章の間がものすごく開いてしまって、レイアウトがおかしくなってしまいました…
タグの意味はなんとなくでしか分からないので、たぶんですけど、画像が左に、文字の方は右に寄ってしまったんだと思います。
文字列の周りに枠ができてるのは分かったので、ピクセル数を変えれば、ここの中の調整ができるのは分かったんですが…

アドバイスありがとうございましたm(__)m