html - 将文字定位在图片上方

Question

问题:我在将文本定位在具有全 Angular 的图片中间时遇到问题。

目前它还不错，但不是在所有分辨率上都不错。

我的代码: jsfiddle

我正在尝试用

实现这一目标

.title{
    position:absolute;
    left: -140px;
    top: 100px;
}

我已经尝试将 % 用于 left 和 top 但它仍然会四处移动。

尝试更改结果区域，您会看到文本在移动，我不希望这样。

我想要的是无论使用哪种分辨率，h2 和 h6 都位于该图片的中间。

我该如何解决这个问题？

谢谢。

Answer 1

这样使用:

.titles {
    color: white !important;
    position: absolute;
    top: 100px;
    text-align: center;
    width: 100%;
}

fiddle :http://jsfiddle.net/praveenscience/c5f3bufq/