html文字环绕图片

要在 HTML 中实现文字环绕图片，可以使用 CSS 中的 float 属性。具体步骤如下：

1. 在 HTML 中插入图片标签，例如：<img src="image.jpg" alt="图片">

2. 在 CSS 中设置图片的样式，包括宽度、高度、边框等属性。

3. 设置图片的 float 属性为 left 或 right，表示图片向左或向右浮动。

4. 在图片前或图片后插入文字，使用 CSS 中的 margin 属性设定文字与图片之间的距离。例如，如果图片向左浮动，则文字应该在图片的右侧，可以使用 margin-left 属性来设置文字与图片之间的距离。

以下是一个示例代码：

<style>
img {
  float: left;
  width: 200px;
  height: 200px;
  margin-right: 20px;
}
</style>

<p>
  <img src="image.jpg" alt="图片">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi.
</p>

在这个示例中，图片向左浮动，文字在图片的右侧，两者之间有 20px 的距离。