CSS3 Gradient分为线性渐变(liner)和径向渐变(radial)。由于不同的渲染引擎实现渐变的语法不同,这里我们只针对线性渐变的W3C标准语法来分析其用法,其余大家可以查阅相关资料。
http://www.runoob.com/css3/css3-gradients.html
径向渐变可参考:http://www.cnblogs.com/rainman/p/5133685.html
线性渐变:
线性渐变语法参数:
第一个参数:指定渐变方向,可以用"角度"的关键词或“英文”来表示:
参数第一个参数省略时,默认为“180deg”,等同于“to bottom”.
第二个和第三个参数,表示颜色的起始点和结束点,可以与多个颜色值。
例如:
background-image:linear-gradient(to left, red, orange,yellow,green,blue,indigo,violet);
效果图
网友评论