渐变
一:线性渐变:(ie9以下不支持)属于背景下的一个属性
方法:linear-gradient()
background: linear-gradient(90deg,red,yellow,blue,rgba(255,255,1,0.7));
第一个值:
1.90deg表示渐变的角度,可正可负。也可以left或者right,但是前面应该加上内核前缀才有用,如:background: -webkit - linear-gradient(left,red,yellow,blue,rgba(255,255,1,0.7));
或者 background: linear-gradient( to left,red,yellow,blue,rgba(255,255,1,0.7));
模糊的值:to left ,to right, to top,to botton
2.具体的角度的数值,角度是指水平线和渐变线之间的角度,按逆时针方向计算。
比如:
标准:0deg:从下到上
90deg:从左要右
非标准:0deg:从左要右(非标准就是加上 -webkit -)
90deg:从下到上
标准和非标准的换算公式:
90 - x = y 。x为标准角度,y为非标准角度。
第二个值:
第二个值开始是颜色的值,可以通过具体的数值规定颜色值的渐变区域。
比如:background: linear-gradient(90deg,
red 100px,
green 140px,
blue 180px,
);
二:径向渐变:
网友评论