此问题在此处已有答案：

Why can't an element with a z-index value cover its child?（5个答案）
4天前关闭。
灵感来源：**视图源：https://vsociety.net/**我想使用z-index将一个文本示例放置在另一个文本示例后面。显然，如果不使用position属性，我就无法使用z-index。这是我的代码：

<h1 style="text-align: center; letter-spacing: 4px; position: relative; z-index: 999">h

  <span style="color: #ccc; position: relative; z-index: -1; font-size: 70px;">e</span> llo

</h1>

这段代码不起作用。我已经使用搜索引擎搜索并询问了ChatGPT 3，但没有找到我的具体问题的答案;我发现的都是“文本背后的图像”
如果你能给我指出正确的方向，我将不胜感激。
我尝试过使用z-index将文本放置在文本后面，这样 hello 中的“e”看起来更大，将被放置在“hello”的其余部分之后。我的意图是“h - llo”将与大得多的“e”重叠作为一种设计形式。我已经将position: relative;与z-index: -1;结合使用。这并没有将“e”放置在“h - llo”之后。我也试过position: absolute;，结果也差不多。<h1> contains the whole word and was originally given的z索引：九九九;and the *span* containing the letter e was given ``z-index: -1;有一阵子我想这可能是一个算术问题，对于+999 + -1 = +998，这不会为span标签产生负的“层位置”。然而，给h1标签一个1的z索引和span标签一个-2的z索引并没有解决这个问题。span标签包含 e 并且嵌套在h1标签内，它包含整个单词 hello。