css上一行图片居中,下一行文字与上一行图片左对齐

可以使用 flex 布局来实现该效果。HTML代码如下：

<div class="container">
  <div class="image-wrapper">
    <img src="your-image-url" alt="your-image-description">
  </div>
  <div class="text-wrapper">
    <p>Your text goes here.</p>
  </div>
</div>

CSS代码如下：

.container {
  display: flex;
  align-items: center;
}

.image-wrapper {
  text-align: center;
}

.text-wrapper {
  margin-left: 10px;
}

解释一下上面的代码：

- `display: flex;` 将父容器 `.container` 设置为 flex 布局。
- `align-items: center;` 将子元素垂直居中对齐。
- `.image-wrapper` 设置图片的容器，使用 `text-align: center;` 将图片水平居中对齐。
- `.text-wrapper` 设置文字的容器，使用 `margin-left: 10px;` 让文字与图片有一定的间距，实现左对齐的效果。