CSS zum Erzielen von Text auf dem Hintergrundbild

<div Klasse="imgs">
  <!-- Hintergrundbild -->
  <div Klasse="Hintergrund">
    <img :src="item.voteTime ? imgSrc1:imgSrc2" width="100%" height="100%" alt="" />
  </div>
  <!-- Text -->
  <div Klasse="vorne">
    <div v-if="item.voteTime">
      <p>Vielen Dank! </p>
      <p>Sie haben abgestimmt: <span>{{item.voteTime}}</span></p>
    </div>
    <p v-else style="color:#999999">Entschuldigung, Sie haben die Abstimmung nicht abgeschlossen~</p>
  </div>
</div>

Daten() {
  zurückkehren {
    imgSrc1:erfordern('@/common/imgs/yitoupiao.png'),
    imgSrc2:erfordern('@/common/imgs/weiwancheng.png'),
  }
},

.imgs {
  Hintergrund: #fff;
  Position: relativ;
  Breite: 100 %;
  Höhe: 250px;
  Farbe: #195541;
  .Hintergrund{
    // Breite: 100 %;  
    // Höhe: 100 %; /**Breite und Höhe betragen 100 %, sodass das Bild den Bildschirm ausfüllt*/
    // z-index:-1;
    z-Index: 1;
    Position: absolut;
    Breite: 250px;
    Höhe: 100%;
    rechts: 20px;
    unten: 0px;
  }
  .Front{
    z-Index: 2;
    Position: absolut;
    Textausrichtung: zentriert;
    oben: 39 %;
    links: 25 %;
    Schriftstärke: normal;
    Zeilenhöhe: 40px;
    Schriftgröße: 28px;
  }
}