<el-card>带图片、内容和操作按钮的卡片，循环的时候，一行固定五个，设置好相隔宽度，自动适应屏幕

您可以使用以下代码实现：

<el-row :gutter="20">
  <el-col :xs="24" :sm="12" :md="8" :lg="6" v-for="item in list" :key="item.id">
    <el-card>
      <div class="card-image">
        <img :src="item.imageUrl" alt="">
      </div>
      <div class="card-content">
        <p>{{ item.title }}</p>
        <p>{{ item.description }}</p>
      </div>
      <div class="card-actions">
        <el-button>{{ item.actionText }}</el-button>
      </div>
    </el-card>
  </el-col>
</el-row>

<style>
  .card-image {
    height: 150px;
    overflow: hidden;
  }
  .card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .card-content {
    padding: 20px;
    text-align: center;
  }
  .card-actions {
    padding: 0 20px 20px;
    text-align: center;
  }
</style>

其中，`list`是一个数组，包含需要循环渲染的数据。每个数据对象包括`imageUrl`、`title`、`description`和`actionText`四个属性，分别代表图片地址、标题、描述和操作按钮文本。

我们使用了Element UI的`<el-row>`和`<el-col>`组件来实现响应式布局。通过设置不同大小的屏幕下每个`<el-col>`占据的宽度，可以实现在不同设备上卡片的适应性布局。具体来说，我们将`<el-row>`组件的`gutter`属性设置为20，来控制卡片之间的间隔。

为了让卡片之间有间隔，我们设置了一些样式，具体可以参考上一个问题的回答。