：before /：after伪元素不用父变换

Question

在这个Link中我有一个在悬停时旋转的div，我想知道是否可以使用：before或：after作为阴影。在示例中：before元素使用div进行转换，即使它具有负z-index也位于顶部。我希望它能够在没有任何转变的情况下休息。

所有关于css，html只是两个div，一个透视容器和'卡'正在转换。

<div id="container">
    <div id="card"></div>
</div>

关于兼容性，这是我试图实现的仅限webkit的实验。

Answer 1

检查此答案：Z-index with before pseudo-element

：之前和之后：伪元素按照定义内部关联元素，因此不可能将它们放在关联元素的外部（后面）。

您必须在<div id="shadow">之前插入第二个元素（例如<div id="card">）。