在vue中如何让图片在左边，文字在右边

在 Vue 中实现图片在左边，文字在右边，可以使用 Flexbox 布局实现。具体步骤如下：

1. 在 HTML 中创建一个父容器，设置 display:flex 和 flex-direction: row。

2. 在父容器中创建两个子容器，一个用于放置图片，另一个用于放置文字。

3. 设置图片容器的 width 和 height，然后添加图片。

4. 设置文字容器的 width 和 height，然后添加文字。

5. 根据需要设置图片和文字容器的 margin 和 padding。

下面是一个示例代码：

<template>
  <div class="container">
    <div class="image-container">
      <img src="your-image-source">
    </div>
    <div class="text-container">
      <p>Your text here</p>
    </div>
  </div>
</template>

<style>
.container {
  display: flex;
  flex-direction: row;
}

.image-container {
  width: 50%;
  height: 100%;
}

.image-container img {
  width: 100%;
  height: 100%;
}

.text-container {
  width: 50%;
  height: 100%;
}

.text-container p {
  margin: 0;
  padding: 10px;
}
</style>