z 索引不起作用.如何让我的文本显示在图像顶部

Question

我正在使用royalslider。我有这个

<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

如果不使用 position ，则 z 索引不起作用。如果您调用了绝对位置，则效果最好。