html - html: 文章を画像に合わせる

Question

私は、いくつかの css スタイルを持つ非常に単純な html に取り組んでいます。画像を段落に並べるのが難しいです。私の div セクションに次のような画像と段落があるとします。

<div>
<img border="1" src="cake.jpg" width="100" height="70">
Tom's review: This is the best cake that I have ever had...
</div>

段落は画像の「右下」に表示されますが、画像の「右上」に表示したいです。

この質問は簡単だと思いますが、html は初めてです。ここで誰か助けてくれませんか？

ありがとう。

Answer 1

画像を左に浮かせる必要があります。

<div>
<img border="1" src="cake.jpg" width="100" height="70" style="float: left;">
Tom's review: This is the best cake that I have ever had...
<div style="clear: both;"></div>
</div>

Answer 2

このコードを使用

<div>
    <div style="float: left;"><img border="1" src="gtld-lifecycle.jpg" width="100" height="70"></div>
<div style="float: left;">Tom's review: This is the best cake that I have ever had...</div>
</div>

Answer 3

段落を一番上に表示したい場合は、段落の後に画像を配置します。

<div>
   <p>Tom's review: This is the best cake that I have ever had...</p>
   <img border="1" src="cake.jpg" width="100" height="70"/><br/>
</div>