如何使用Inline Block属性将文本放置在背景图像下方

Question

您好，我试图将文本放在背景图像下方。像这里一样，我想将两个背景图像并排放置，我想放置文本的每个图像。我参加了一个Div类，其样式内联块属性。因此，我如何借助或使用Inline Block属性来做到这一点。我尽可能地解释了我的问题。如果可能的话，请浏览我的小提琴链接。我已经尝试了此属性，但是文本在图像上与我想要的图像重叠，也可以检查与背景图像没有人完成的类似问题，因此请查看我的代码，在评论框中给出了我尝试过的内容。请帮我谢谢。:)

Answer 1

您尚未在imgcontainer中为您的段落标签设置CSS属性。

在小提琴中，我添加了以下内容：

.imgcontainer p {
  position: relative;
  top: 100px;
}

我还向两个背景图像添加了background-size。我使用了background-size: cover;（我用网站上的图像文件夹中的图像URL替换了图像URL）

https://jsfiddle.net/rachgal/f0fsld2h/：fiddle

Answer 2

我希望这就是您要寻找的东西。

这是一个更新的小提琴的链接：小提琴

如果将TE背景色更改为图像，它仍应工作

我只是添加了：

.imgcontainer p {
  position: relative;
  bottom: -90px;
  max-width: 100px;
}

段