12.9学习内容

渐变：

　　1线性渐变：

　　　属性：linear-gradient（ 开始位置，角度，起始颜色，终止颜色，位置）

　　开始位置：渐变开始的位置，属性值可以为百分比/长度/left、right、top、bottom（可以组合使用）

　　角度：渐变终止方向的角度，当开始位置为数值或百分比时候可以使用；

　　起始颜色.....必写选项

　　终止颜色.....必写选项

　　重复渐变属性将修改为：repeating-linear-gradient-（）

　　2.径向渐变（放射性渐变）：

　　　属性：radial-gradient（开始位置，角度，起始颜色，终止颜色，终止颜色）

　　形状：ellipse（椭圆）/circle（圆形）

　　发散方向：属性值可以为left、right、top、bottom、center（可以组合使用）

　　大小（半径）：属性值可以用元素或者关键字表示

　　closest-side：圆心到距离最近的边

　　farthest-side：圆心到距离最近的边

　　closest-corner：圆心到距离最近的角

　　farthest-corner：圆心到距离最远的角

　　起始角度.....必填项

　　终止角度....必填项

　　重复的径向渐变：repeating-radial-gradient（）；

下面是关于变形transfrom的用法和属性：

　　1.none 不进行转换

　　2translate（x，y）定义2D转换

　　3translateX（X）定义转换，只是用X轴的值

　　4translateZ（Z）定义3D转换，只是用Z轴的值　　

　　scale（x，y）定义对于2D的缩放；

　　scaleX（x）通过X轴来进行缩放；

　　scaleY（y）通过Y轴来进行缩放；

　　rotate（angle角度deg）定义2D旋转，在参数中规定角度、弧度。

　　rotateX（x）定义沿着X轴的3D旋转；

　　rotateY（y）定义沿着Y轴的3D旋转；

　　skew倾斜

　　skew（x-angle，y-angle）定义沿着x轴和y轴进行2D倾斜

　　skewX（x角度）定义沿着X轴的2D倾斜转换。

　　skew（y角度） 定义沿着Y轴的2D倾斜转换。

　　matrix（n，n，n，n，n，n）多边形定义2D转换，使用6个值得矩阵。

　　transform-origin定义变形的基准点也就是起点

　　1.可以使用像素，百分比（百分比是以父元素的大小来决定的）

　　2.X轴：left/right /center

　　3.Y轴：top/bottom/center

　　perspective(n)为3D转换元素定义透视视图。