1. 程式人生 > >Safari 3D變換會忽略z-index問題解決

Safari 3D變換會忽略z-index問題解決

方法1:

父級,任意父級,非body級別,設定overflow:hidden可恢復和其他瀏覽器一樣的渲染。

方法2:

我們的紅色條子在z軸位置0處,對不對,所以才從圖片的中心穿過。而z軸是我們眼睛看螢幕這條軸,在z軸的值越大,就離使用者的眼睛越近;值越小,裡使用者眼睛越小。所謂近大遠小(如果指定了視角perspective),就是這麼回事。

所以,我們要想讓紅色條子覆蓋在圖片上,只要設定一個足夠大的translateZ值就可以,如100px

transform: translateZ(100px)
原文by zhangxinxu from http://www.zhangxinxu.com/wordpress/?p=5569