天天看點

水果手機 Safari transform rotateY 不相容問題

移動端寫css3 時 發現在safari 上  一個元素使用了  transform:rotateY(19deg);   顯示有問題。

這樣 class 元素就看不到了,

水果手機 Safari transform rotateY 不相容問題

然後挨着試在class 元素上添加 

transform-style: perspective-3d, 或者visibility:visible

, perspective:1000, 也都無濟于事,

transform-style 兩個值 flat 即預設 2d,perspective-3d 即 所有子元素在3d空間中展示,

perspective : w3c 上看了 一段  

試着 在父類元素上添加 perspective 小圖示果斷顯示出來了

水果手機 Safari transform rotateY 不相容問題

繞Y軸旋轉 效果。。。。。

水果手機 Safari transform rotateY 不相容問題

再 說下 如果  元素使用動畫 用了  transfrom  屬性 

這樣 手機上是不會顯示動畫效果的

需要在.class 裡加上初始的 效果

繼續閱讀