我有一个很基本的例子,我有一个固定的标题与其他元素相互堆叠,单个元素是转换使用transform:rotate(360deg).
因此,只有当页面滚动时,已转换的元素才能越过固定栏,其他元素则不会.那么问题是转化元素是否具有默认的z-index?
When you use
z-index: -1;
for.transform_me
it behaves normal
CSS
.fixed { height: 30px; background: #f00; position: fixed; width: 100%; top: 0; } .transform_me { transform: rotate(360deg); -webkit-transform: rotate(360deg); } span { display: block; height: 100px; }
Note: It will be solved if we use say
z-index: 999;
for the fixed
div,but that’s not what am looking for.
解决方法
For elements whose layout is governed by the CSS Box model,any value other than
none
for thetransform
results in the creation of both a stacking context and a containing block. The object acts as a containing block for fixed positioned descendants.