Html 如何使子z指数大于父z指数或以任何其他方式达到效果？

我试图发展以下效果。 父母是这样的两个部分，孩子是一个图像。如何在不使用绝对值的情况下实现这一点

<section>
  <img />
</section
<section>
  ..more content
</section>

您可以通过使用嵌套的默认行为来实现这种效果

<div class="parent1">
  <div class="parent2">
    <div class="child"></div>
  </div>
</div>



此布局将根据您的要求对齐项目，无需使用
z-index
位置：相对
，红色父项上的
底部
和
左侧
的正确值即可。
您还可以使用
transform:translate（xValue，yValue）
来实现相同的效果。
只需记住正确调整z索引。
试着保持img标签

   </section>
   <img>
   <section class="section-2">
   </section>```

you can check this if it can work for you : 
try this fiddle


  https://jsfiddle.net/anviksuteiriy/d781L6ry/11/


```
如果它对您有效，您可以对此进行检查：
试试这把小提琴
https://jsfiddle.net/anviksuteiriy/d781L6ry/11/
到目前为止，您是如何实现这一目标的？请在代码片段中发布HTML和CSS，以再现您当前的情况。第2节不能包含在第1节中