css中文字环绕图片怎么写

CSS中文字环绕图片是一种常见的页面布局，可以让页面看起来更加美观。下面我们来学习一下如何实现文字环绕图片。

 <div class="wrap">
        <img src="图片路径" alt="图片描述">
        <p>这是需要环绕的文字。</p>
    </div>

    .wrap {
        width: 400px;
    }
    img {
        float: left;
        margin-right: 10px;
    }
    p {
        text-align: justify;
    } 

以上代码就是实现文字环绕图片的基本代码。首先，我们创建一个包含图片和文字的div容器，并设置容器的宽度。接着，我们给图片添加float属性，让它向左浮动，并设置一定的右边距，避免文字和图片挤在一起。最后，我们给文字添加text-align: justify属性，让文字自动换行并排版好。

需要注意的是，使用文字环绕图片布局时，容器的宽度要考虑图片的宽度，以使文字排版更加美观。

除了以上代码之外，还可以通过使用CSS shape-outside属性来实现更加复杂的文字环绕图片效果。但是，该属性的浏览器兼容性不是很好，需要谨慎使用。