如何让文字部分覆盖我的图像？

Question

我想知道如何让文字部分覆盖图像。

屏幕截图：→Mocking UnitOfWork with Moq and EF 4.1。 （我已经用蓝色盘旋了我想要的东西！）

我在谷歌搜索过这个，但我收到的唯一结果是here，这不是我想要的。

非常感谢任何帮助。

Answer 1

只需在文字元素中使用 position: relative ，然后将其偏移一些值。

<强>代码：

h1 {
  position: relative;
  top: 50%;
  right: 6%;
}

jsFiddle：→here。

示例：

＆＃13;

＆＃13;

#wrapper {
  display: flex;
  justify-content: center;
}
#parent {
  width: 550px;
  height: 343px;
  background-image:
    url(https://media-cdn.tripadvisor.com/media/photo-s/08/73/aa/76/trolltunga.jpg);
  background-size: contain;
}
#child {
  position: relative;
  top: 50%;
  right: 6%;
}

＆＃13;

<div id="wrapper">
  <div id="parent">
    <h1 id="child">A Fantastic Title<br/>&rarr;</h1>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;