css文字靠左上显示图片 |css对图片截取

<div class="content">
<img src="image.jpg" alt="图片">
<p>这是一段文字，文字将自动环绕绕过图片的位置显示。</p>
</div>
<style>
.content {
width: 600px;
height: 300px;
position: relative;
}
.content img {
position: absolute;
top: 0;
left: 0;
}
.content p {
margin-left: 150px;
}
</style>

以上代码中，首先将需要在文字段落中显示的图片和文字都包含在一个 div 标签中，然后设置该 div 的宽度和高度，以及相对定位。接着，将图片设置为绝对定位，并且设置其 top 和 left 值为 0，这样图片将粘贴在 div 左上角。最后，通过将文字的 margin 左边距设置为图片的宽度加上一定的间距（这里设置为 150px），来让文字在图片的右侧显示并且环绕绕过图片。

通过以上方法，就可以实现在文字段落中将图片靠左上显示，并且文字可以自动环绕绕过图片的效果了。此外，还可以通过设置图片的 z-index 值来调整图片与文字的层级关系，以实现更丰富的页面排版效果。