css 两边到中间 渐变_css3渐变过渡机制

1.CSS3变形

变形简介

(1)CSS3变形是一些效果的集合，如平移、旋转、缩放、倾斜效果，每个效果都可以称为变形(transform)，它们可以操控元素发生平移、旋转、缩放、倾斜等变化。

语法：transform：[transform-function]*；

(1)transform-function：设置变形函数，可以是一个也可以是多个，中间用逗号隔开

①translate()：平移函数，基于x、y坐标重新定位元素的位置

②scale()：缩放函数，可以使用任意元素对象尺寸发生变化

③rotate()：旋转函数，取值是一个度数值

④skew()：倾斜函数，取值是一个度数值

(2)transform 3D变形函数：translate3d()平移函数、scale3d缩放函数、rotate3d旋转函数

2D变形的浏览器兼容性

2D变形

(1)2D位移：将元素从一个位置上移动到另一个位置上

语法：translate(tx，ty);

①tx：横坐标移动的向量长度，正值向右，负值向左

②ty：纵坐标移动的向量长度，正值向下，负值向上

③tx、ty常用单位是px，也可以是百分比

(2)当translate()函数只有一个值的时候，表示水平偏移；如果只设置垂直偏移，就必须设置第一个参数为0，第二个值是垂直偏移量

2D

总结

以上是生活随笔为你收集整理的css 两边到中间 渐变_css3渐变过渡机制的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。