覆盖div或图像以显示不使用伪元素的文本

<div class="container">
  <img src="image.jpg" alt="Image">
  <div class="text-overlay">Text Overlay</div>
</div>

.container {
  position: relative;
  display: inline-block;
}

.text-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

<div class="container">
  <div class="text-overlay">Text Overlay</div>
</div>

.container {
  position: relative;
  display: inline-block;
  background-image: url(image.jpg);
  background-size: cover;
  background-position: center;
}

.text-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}