bulma-card-overlay.vue

<template>
  <section class="section container">
    <div class="card">
      <div class="card-image">
        <figure class="image is-4by3">
          <img
            src="https://bulma.io/images/placeholders/1280x960.png"
            alt="Placeholder image"
          />
        </figure>
      </div>
      <div class="card-content is-overlay">
        <div class="tags">
          <span class="tag is-primary">Overlay 1</span>
          <span class="tag is-primary">Overlay 2</span>
        </div>
      </div>
      <div class="card-content">
        <div class="media">
          <div class="content">
            <p class="title is-4">John Smith</p>
            <p class="subtitle is-6">@johnsmith</p>
          </div>
        </div>
      </div>
    </div>
  </section>
</template>