我正在一个网站上工作，我想在其中展示一个巨人图片背景中的幻灯片以及引用和链接，出于技术目的（编辑：在下面的评论中描述）必须位于同一父元素中。最重要的是我正在显示我的内容，并且在某一时刻我希望背景图像通过内容显示，我通过在我的两个内容元素（#header和#main）之间设置边距来实现这一点。描述起来有点困难，但我希望这个 jsfiddle能让我了解我在做什么。
问题是背景中显示的链接和引用是不可点击的，因为点击是指向上面显示的元素（#header）。我知道，pointer-events: none;但这并不好，因为我需要 IE 支持并且能够解释#header元素中的点击。
我想这在某种程度上归因于这个答案中提到的堆叠上下文，但我就是做错了。如果不使用负 z-index on ，我无法获得所需的布局#background，而里面的链接#background可能需要放在更高 z-index 的父级中。合理的做法可能是将其放在标记中的其他位置，但如上所述，链接与内部的其余内容相关#background。是否可以使链接堆叠上下文呈现在其父元素的堆叠上下文“上方”？
代码有点太长了，在这里做不到任何好处，而且不是很复杂，所以请参考前面提到的jsfiddle。