skewY() | CSS属性参考

CSS skewY()函数用于在二维空间中沿Y轴对一个元素进行倾斜。

skewY()函数的语法如下:

transform: skewY(<angle>);

skewY()用于在Y轴方向上倾斜元素。它接收<angle>值参数。如果值为正数,元素的左上和右下角会被“拉扯”。如果值为负数,元素的右上角和左下角会被“拉扯”。如果值为180deg或-180deg,那么元素没有变化。

倾斜一个元素也同时会倾斜元素的坐标系统。所以注意在你倾斜一个元素之后,元素初始的坐标系统会发生改变。

下面是一些示例代码:

transform: skewY(30deg);
transform: skewY(-30deg);
transform: skewY(-0.5rad);
transform: skewY(-1turn);
transform: skewY(-90deg);

下面的图片展示了元素沿X轴倾斜的效果:

skewY() | CSS属性参考 skewY()函数倾斜元素的效果

浏览器支持

CSS3 2D Transform的浏览器兼容性列表如下:

skewY() | CSS属性参考

相关阅读
未经允许不得转载:yiweibang.com易微帮 » skewY() | CSS属性参考
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,请不要用于商业用途!
3. 如有链接无法下载、失效或广告,请联系站长处理!
4. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
5. 如果你也有好模型或者教程,可以到审核区发布,分享有金币奖励和额外收入!
6. 本站提供的模型、教程、施工图等等其他资源,都不包含技术服务 请大家谅解!
7. 如遇到加密压缩包,默认解压密码为yiweibang.com如遇到无法解压的请联系管理员!
分享到:
赞(0)