css - z 索引不起作用。如何让我的文字显示在图像之上

Question

我正在使用皇家滑块。我有这个

<a class="rsImg" data-rsDelay="1000" href="image.jpg">
  <span>This is caption <b>HTML1</b> text</span>
</a>

这可以正常工作并将文本放在图像下方。但是，我想在图像顶部显示文本。但是当我向上移动文字时，它会在图片下方而不是在顶部。我试过这个

<a class="rsImg" data-rsDelay="1000" href="image.jpg" style="z-index:-10000 !important;">
  <span style="z-index:10000 !important;margin-top:-100px;">
    This is caption <b>HTML1</b> text
  </span>
</a>

但这没有用。任何帮助将不胜感激

Answer 1

来自http://www.w3schools.com/cssref/pr_pos_z-index.asp

注意：z-index 仅适用于定位元素（位置：绝对、位置：相对或位置：固定）。

Answer 2

如前所述，将其添加到您的 CSS 中：

position: relative; 

那么它应该可以工作，在这种情况下，我会使用相对定位。

Answer 3

The z-index does not work if you do not use position. It works best if you have called position absolute.