I have this html which works fine on Chrome, Safari and Mobile Safari.
<html><head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
</head>
<body>
<div style="position:relative;-webkit-perspective:1000;width:300px;height:50px">
<div style="position:relative;width:300px;height:50px;-webkit-transform-origin:0px 25px 0px;-webkit-transform-style:preserve-3d;">
<div style="position:absolute;width:300px;height:50px;-webkit-transform:translateZ(125px);background-image:url(http://i855.photobucket.com/albums/ab119/ansherina6/banner2-1.png)"></div>
</div></div>
</body></html>
在Android 4.0.3上,translateZ对div没有显示任何(期望的)效果。除了translateZ外,其他所有东西都正常工作。如果我使用translate3D(a,b,c),那么仅X和Y值会影响渲染。有没有解决这个问题的方法?