2024年04月09日 懒猪 前端开发 前端博客 个人博客 网站制作 鹏仔先生 百变鹏仔 HTML CSS javascript JS 共享博客
1. 改变变形元素中心位置
语法:
transform-origin: left | right | center top | center | bottom;
2. 变形综合
将多种变形综合在一起时，顺序不一样，效果有可能不一样
eg:
transform: rotate(360deg) scale(1.5); transform: scale(1.5) rotate(360deg);
顺序改变，效果不变
eg:
transform: translateX(100px) rotate(360deg); transform: rotate(360deg) translateX(100px);
顺序改变，效果不一样
3. 设置元素是2d变形还是3d变形
语法:
transform-style: flat(2d变形) | preserve-3d(3d变形);
4. 设置透视，井深(即3d效果的强度)
语法:
perspective: 数值+单位;
eg: 给父元素添加同一的透视值
父元素{
perspective: 1500px;
}eg: 还可以单独给某一个子元素设置透视值
子元素{
transform: perspective(500px) rotateY(30deg);
}本文链接：http://so.lmcjl.com/news/1555/