当前位置: 首页 > 面试题库 >

如何使子元素的z索引高于父元素?

戚逸清
2023-03-14
问题内容

假设我有以下代码:

<div class="parent">
    <div class="child">
        Hello world
    </div>
</div>

<div class="wholePage"></div>

现在,我需要<div class="child">在上面,<div class="wholePage">但是在jsFiddle中,您可以看到child元素呈现在before之前<div class="wholePage">

如果您删除 parentpositionz-index,则一切正常。这是我需要的正确行为: http
//jsfiddle.net/ZjXMR/1/

如何在z-index不删除页面的情况下执行此操作?


问题答案:

这是不可能的,因为子级的z-index设置与父级的堆叠索引相同。

您已经通过从父级移除z-index来解决该问题,将其保持为这种状态,或者将该元素设为同级而不是子级。



 类似资料:
  • 问题内容: 我需要一个动态元素始终出现在另一个元素的顶部,无论它们在DOM树中的顺序如何。这可能吗?我已经尝试了(和),但似乎没有用。 我需要: 呈现时完全相同。并且出于灵活性目的(我计划分发需要此功能的插件),我真的不想不必求助于绝对或固定位置。 为了执行我想要的功能,我做了一个条件语句,其中重叠的子元素将在阻止其父视图的情况下变得透明。这不是完美的,但它是某种东西。 问题答案: 如果元素构成层

  • 问题内容: 假设我有这个标记: 我有这个jQuery: 单击该子项时,如何获得子项相对于其父项的索引? 例如,当您单击“步骤1”时,应弹出带有“ 0”的。 问题答案: 但是,与其为每个列表项附加一个单击处理程序,不如(在性能方面)更好地使用如下所示: 在jQuery 1.7+中,您应该使用。下面的示例将事件绑定到元素,就像委托事件一样工作:

  • 在此代码中,节的高度为0。但img的高度为600px。我如何将img的高度赋予它的父元素,也就是section? 正如您在图片部分中看到的,class=“banner container”没有高度。

  • 问题内容: 我用一个pre-pseudo元素创建了一个’header’元素。pseudeo元素必须位于父元素之后。一切正常,直到我给我的“页眉”添加z-index为止。 我想要的是:前景上的黄色“标头”,背景上的红色伪元素以及黄色“标头”元素上的简单z索引30。 您可以在此链接)上测试我的问题,当您在de’header’元素上设置/删除z-index时,您会看到问题。 问题答案: :: befor

  • 问题内容: 使用D3库将SVG元素置于z顺序顶部的有效方法是什么? 我的特定情况是一个饼图其中突出(通过添加到)当鼠标在给定的片。生成我的图表的代码块如下: 我已经尝试了几种选择,但到目前为止还没有运气。同时使用和调用均无效。 在我的CSS中,“ top”类的定义如下: 该语句可以确保我知道它正确打开/关闭。它是。 我听说过使用是一个选项,但是我不清楚如何将“ selected”元素置于顶部。 更

  • 问题内容: 我想在z平面上订购3个HTML元素: 我希望 按钮 在 银行的 上方,但在 卡的背面 。但是无论我尝试什么,该 按钮 始终位于 银行 和 卡上 。 编辑:我注意到从’.bank’中删除z-index和transform可以解决它,但是我需要transform属性。 我能做什么? 是什么导致它无法正常工作?谢谢 问题答案: 不要指定任何内容以避免创建新的堆栈上下文,而只需调整其他元素的即