<html>
<head>
<meta charset="UTF-8">
<title>八桂金融</title>
</head>
<style type="text/css">
body {margin: 0overflow: hidden}
.box {height: 300px}
.num {height: 150pxwidth: 150pxbackground: rgba(255, 255, 255, 0.5)}/*仅仅background被渲染透明度50%*/
.box2 {height: 300px}
.num2 {height: 150pxwidth: 150pxbackground:#fffopacity: 0.5}/*div内容全部都被opacity渲染,透明度50%*/
</style>
<body>
</body>
<div class="box" style="background: url(
)">
<div class="num">
123
</div>
</div>
<br>
<div class="box2" style="background: url(
)">
<div class="num2">
123
</div>
</div>
</html>
指定对象围绕着 X / Y / Z 轴上的旋转角度
指定对象的 3D 旋转角度
前三个参数分别代表旋转的方向 x,y,z,第四个参数表示旋转的角度,参数不允许省略
前三个参数只有三个取值效果:正数,0,负数
如果多个方向发生改变,小数会代表在这个方向的旋转程度,最小小数取值为 0.1
指定对象 Z 轴的平移(更多用于遮罩)
z 值不能省略
指定对象的 3D 位移
第一个参数对应 X 轴,第二个对应 Y 轴,第三个对应 Z 轴,参数不允许省略
指定对象的 Z 轴缩放
参数对应 Z 轴,不允许省略
指定对象的 3D 缩放
参数不允许省略
指定观察者与 XOY 平面(也就是屏幕)的距离,使具有三维位置变换的元素产生透视效果
指定透视点的位置
x-axis:50%
y-axis:50%