实例介绍CSS3的3D旋转效果的旋转

这个例子的例子给大家分享的旋转效应的CSS3 3D旋转的例子供你参考，以下具体内容

设计素描 uff1a


示例代码

xml代码将内容复制到剪贴板。






三维旋转演示

{ #实验
WebKit的角度：800；
50%看产地：50% WebKit；
WebKit的变换风格：- webkit-preserve-3d；
}
{ #块
宽度：200px；
身高：200px；
背景颜色：粉红色；
保证金：100px汽车；
WebKit的转型：背景颜色3s；
}
{ #块：悬停
背景颜色：紫色；
}
{ # EP
文本对齐：中心；
}
# EP {输入
宽度：800px；
}


函数旋转（）{
Var x = document.getElementById (rotateX).Value;
var y = document.getelementbyid（rotatey ）的价值；
VaR z = document.getelementbyid（rotatez ）的价值；
document.getelementbyid（块）。style.webkittransform =rotatex（X度）rotatey（+ Y +°）rotatez（+ Z +°）；

document.getelementbyid（使跨度）。InnerText = x；
document.getelementbyid（degy跨度）。InnerText = Y；
document.getelementbyid（degz跨度）。InnerText = Z；
}







旋转X：0deg

旋转：0deg

旋转：0deg








以上是本文的全部内容，希望能对大家有所帮助。