覆盖CSS Z索引堆栈上下文

我试图覆盖/忽略元素的堆叠上下文,以便它可以相对于页面根位于z轴上.

但是,根据文章What No One Told You About Z-Index：

以下示例：

HTML：

<div><span class="red">Red</span></div>
<div><span class="green">Green</span></div>
<div><span class="blue">Blue</span></div>

还有一些CSS

.red,.green,.blue { position: absolute; }
.red   { BACkground: red; }
.green { BACkground: green; }
.blue  { BACkground: blue; }

如果第一个div被赋予不透明度：.99;(它在第一个节点上创建一个new stacking context),那么即使.red有z-index：1,它仍然会被放置在其他元素的后面,因为它只是渲染为该堆栈内的最高元素.

Working Demo in jsFiddle

看起来像这样：

问：是否有一种方法可以忽略任何一个父元素的堆栈上下文,并要求相对于页面的原始堆栈上下文进行定位？

<div class="red"><span>Red</span></div>
<div class="green"><span>Green</span></div>
<div class="blue"><span>Blue</span></div>