Html 在div中显示img旁边的文本

我有一个div，它包含一个img、p标签和h6文本。我想在图片的右侧浮动文本，而不是将其包裹在下面

我尝试过左右浮动和清除，在div上显示内联块和浮动img，但我无法让它看起来正确

<div class="col">
  <img src="images/homepage-blue-icon.png" class="body-img" title="Me" alt="Me" align="left" />
  <h6>Blueberries</h6>
  <p>Healthy and nutritious</p>
</div>

蓝莓
健康营养

也许您可以将它们放在一行的表格中

<table>
  <tr>
    <td>
        <img style='' src="img.jpg" class="body-img" title="Me" alt="Me" align="left" />

    </td>

    <td>
      <div>
        <h6>Blueberries</h6>
        <p>
          "Lorem ipsum dolor sit amet, consectetur adipiscing elit,
          sed do eiusmod tempor incididunt ut labore et dolore
          magna aliqua. Ut enim ad minim veniam, quis nostrud
          exercitation ullamco laboris nisi ut aliquip ex ea commodo
          consequat. Duis aute irure dolor in reprehenderit in voluptate
          velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
          occaecat cupidatat non proident, sunt in culpa qui officia deserunt
           mollit anim id est laborum."
        </p>
      </div>
    </td>
  </tr>
</table>

蓝莓

“Lorem ipsum dolor sit amet，献祭精英，
临时劳工和福利费
这是一个巨大的财富，它是一个微小的财富
ullamco laboris nisi ut aliquip ex ea commodo实习
在沃鲁帕特的reprehenderit中，两人或两人之间的冲突
除圣约翰岛外，其他地方无任何法定权利
有时，不可轻率行事，但必须以职权为重
莫利特·阿尼姆是一名劳工。”

有几种方法：

float

和

margin

h6，
p{
利润率：0.55px；
}
.人体内模{
浮动：左；
}

蓝莓
健康营养

健康营养

健康营养

健康营养

健康营养

给定的代码为我提供了所需的左边图像输出，后面是右边的文本。我建议您检查您的身体img类和col类

align=left

已过时近20年，请在CSS文件或样式标记中使用

float:left

。。如果图像的宽度已知，留一个大小相等的空白就足够了。或者您可以使用

display:flex

@marciojc flex在这里不是最好的，您至少有3个标记：），网格将是完美的…最后一件事，有没有办法使文本和p标记与图片的高度相同？@cal您的图片大小是多少？我认为显示器可以（网格或表格）你能添加更多信息并最终提出一个新问题吗？