10/24
2014
这是一个常规的线性渐变,其在chrome下代码如下:
background:-webkit-gradient(linear, 0% 0%, 00% 100%, from(yellow), to(orange));
不要担心这些语法会让你看花眼,我也是这样的!只要记得我们需要用一个逗号来隔开这个参数组。
渐变的类型? (linear)
渐变开始的X Y 轴坐标(0 0 – 或者left-top)
渐变结束的X Y 轴坐标(0 100% 或者left-bottom)
开始的颜色? (from(color))
结束的颜色? (to(color))
调整了起始点和终点的样式:
同上chrome下的代码:
background:-webkit-gradient(linear, 20% 10%, 10% 90%, from(yellow), to(orange));
为了兼容性考虑可以在渐变之前写一个纯色背景;颜色可以用rbg/rgba格式或16进制颜色
包含ff的代码请看这里