Html 如何将文本精确地设置在图像的底部，以及图像和底部文本是否完全对齐

您好，请仔细阅读这个问题这不是重复的问题，我想在背景图片下面写下文字，并且背景图片包含背景大小：中间；属性，所以当我试图在它下面放置文本时。背景图像和文本内容必须居中。请参考我的图片，然后你会得到我真正想要的。该链接发布在评论框中。我还提供了我已经尝试过的代码。我是级联样式表的新手，所以请帮助我，提前表示感谢。：）

您的问题是，您正在使用图像作为您正在编写内容的同一元素的背景。。。您需要一个更像这样的结构：

<div class = "layer9">
  <h1><center>Outcome</center></h1>
  <div class = "outcome main norep lay"></div> //background image on this
  <div class = "content"> //content is seperate, but a sibling - that goes below
     <p>kjsdadjaljdlsadla</p>
     <p>kjsdadjaljdlsadla</p>
  </div>
</div>

结果
//这张照片的背景图片
//内容是分开的，但有一个兄弟姐妹——这就在下面
kjsdadjaljdlsadla

kjsdadjaljdlsadla

请参考我实际制作的图像，这是我尝试过的代码@Rachel Gallen请帮助我。请澄清，您的问题是如何对齐背景图像后面的文本，使其隐藏？不，我只想将文本放在图像下面，并且该图像具有背景大小：居中顶部属性。那么，如何在图片下方添加文字呢？请帮帮我，伙计们，我真的需要帮助。