首頁 > web前端 > css教學 > 為什麼`transform:rotate()`取消了`z-index`?

為什麼`transform:rotate()`取消了`z-index`?

Mary-Kate Olsen
發布: 2024-12-23 20:43:14
原創
430 人瀏覽過

Why Does `transform: rotate()` Cancel Out `z-index`?

Z-index被Transform(rotate)取消

理解行為

在CSS中,使用transform屬性可以建立一個新的「堆疊上下文” “在一個元素上。值的元素也會建立自己的堆疊上下文。然後,.test:after 偽元素被分配z-index: -1。之後。因此,.test:after 上的z-index: -1 只會影響其在.test堆疊上下文中的位置。 test放入包裝容器中並旋轉容器。為.test 和.test:after 建立單一堆疊上下文。按預期生效。

以上是為什麼`transform:rotate()`取消了`z-index`?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板