skewY()
尝试一下
skewY()
函数定义了一个转换,该转换将元素倾斜到二维平面上的垂直方向。它的结果是一个<transform-function>
数据类型。
这种转换是一种剪切映射(横切),它在水平和垂直方向上将单元内的每个点扭曲一定的角度。每个点的坐标根据指定的角度以及到原点的距离,进行成比例的值调整;因此,一个点离原点越远,其增加的值就越大。
语法
skewY(a)
参数值
示例
HTML
<p>foo</p>
<p class="transformed">bar</p>
CSS
p {
width: 50px;
height: 50px;
background-color: teal;
}
.transformed {
transform: skewY(40deg);
background-color: blue;
}
结果
规范
Specification | Status | Comment |
---|---|---|
CSS Transforms Level 1 skewY() |
Working Draft | Initial definition |
浏览器兼容
有关兼容性信息,请参阅 <transform-function>
的数据类型。