rotateY()
该rotateY() CSS功能定义了围绕元素的纵坐标（垂直轴）旋转元素而不会使该元素变形的变换。其结果是一个<transform-function>数据类型。
旋转轴通过由transform-originCSS属性定义的原点。
注： rotateY(a)相当于rotate3d(0, 1, 0, a)。
注意：与2D平面中的旋转不同，3D旋转的组成通常是不可交换的。换句话说，旋转的顺序影响结果。
语法
rotateY()创建的旋转量由一个<angle>指定。如果该值是正的，运动将是顺时针的; 如果是负值，则会逆时针旋转。
rotateY(a)可能值
a是代表旋转的角度<angle>。正角度表示顺<angle>时针旋转，负角度表示逆时针旋转。
Cartesian coordinates on ℝ2 | Homogeneous coordinates on ℝℙ2 | Cartesian coordinates on ℝ3 | Homogeneous coordinates on ℝℙ3 |
|---|---|---|---|
This transform applies to the 3D space and cannot be represented on the plane. | cos(a)0sin(a)010-sin(a)0cos(a) | cos(a)0sin(a)00100-sin(a)0cos(a)00001 |
实例
HTML
<div>Normal</div>
<div class="rotated">Rotated</div>CSS
div {
width: 80px;
height: 80px;
background-color: skyblue;
}
.rotated {
transform: rotateY(60deg);
background-color: pink;
}结果
另见
transform
<transform-function>
本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com
