纯js和css实现渐变色包括静态渐变和动态渐变
当我开始搜索查找这个名词的时候，才发现它实际上是有两种理解或者说是两种形式的：动态渐变和静态渐变。
所谓动态渐变，举个简单的例子：他来了，她的脸渐渐红了...渐渐的，渐渐改变的，是不断在改变的；而静态渐变，也就更简单了：天上一到彩虹，赤橙黄绿青蓝紫啊...在当前展示的成品中，颜色从一部分到另一部分的颜色是不一样的，可能幅度比较小，是逐渐改变的，但有一点是至关重要的，它已经存在了，形成了变化的现状且无法再改变。
这样我们先来用javascript实现一下所谓的动态渐变，考虑动态原因就不上图了，我来简单介绍下思路：
* 动态渐变
<span>
在不考虑兼容的前提下，额，真改研究下兼容了，这弄界面不考虑兼容有点缺啊，好吧，先这样继续说，我是用的webkit内核，就先用这个来介绍
在css样式中添加：
background:-webkit-gradient(linear, 100% 0%, 0% 0%, from(#ffffff),color-stop(0.5,#0000ff),to(#ffffff));
简单解释下：
linear：这个就碰到了线性渐变和径向渐变的两个概念，无非是在一条线上进行变化的线性和像圆一样向四周扩散的径向；
后面的四个值：分别代表相应方向的px值，可以从左顺时针转的顺序记忆，但是它代表的是to，截止到的颜色
from：这就是开始的颜色了
to：和from是同时出现的，最后渐变结束的颜色
而color-stop：则是指在变化到线的哪个位置的时候会出现什么颜色，当然是从周围过渡过去的，相当于from，to过渡点，from过渡点，to；
好了，这样就明白多了吧，附送下简单的其他的基本代码FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=#b8c4cb,endColorStr=#f6f6f8);/*IE6*/ background:-moz-linear-gradient(left,#ffffff,#ff0000);/*非IE6的其它*/ background:-webkit-gradient(linear, 100% 0%, 0% 0%, from(#ff0000), to(#0000ff));/*非IE6的其它*/
今天看了一集《开讲了》，原来还有这么好看的节目，太lower了么我....
-
主要内容：1. 线性渐变,2. 径向渐变,3. 圆锥渐变,4. 重复渐变CSS 中的渐变指的是两种或多种颜色之间的平滑过渡，以前我们必须使用事先定义好的图像来实现渐变效果，在 CSS3 出现以后则简单了很多，CSS3 为实现渐变效果提供了一种灵活的解决方案。 通过 CSS3 您可以定义三种类型的渐变，分别为线性渐变（通过 linear-gradient() 函数创建）、径向渐变（通过 radial-gradient() 函数创建）和圆锥渐变（通过 conic-grad
-
问题内容： 要在元素上具有渐变背景，我需要执行以下操作： 现在，jQuery是否不打算消除与跨浏览器兼容性问题有关的所有工作？有没有更好的方法可以做到这一点。不使用任何其他插件？ 问题答案： 有一个用于处理渐变的jQuery插件。我没用过，但是看起来很简单 http://plugins.jquery.com/project/gradient 继承人如何使用它： http://www.julien-
-
Another hard-to-write CSS3 feature is a gradient. You have to repeat long gradient definition multiple times with different vendor prefixes. Also, if you want to cover all gradient-supported browsers,
-
使用渐变填充可以在要应用其他任何颜色时应用渐变颜色混和。创建渐变填色是在一个或多个对象间创建颜色平滑过渡的好方法。您可以将渐变存储为色板，从而便于将渐变应用于多个对象。 注：如果要创建颜色可以沿不同方向顺畅分布的单个多色对象，请使用网格对象。 要查看使用渐变来改进绘画的视频，请参阅 www.adobe.com/go/lrvid4017_ai_cn。有关创建渐变的教程，请参阅 “Unleash th
-
问题内容： 我四处寻找，对此一无所获。 如果我有一段文字，有没有办法，也许是CSS3，当它向下到页面时逐渐改变文字的颜色吗？而不是渐变的方式，因为那只会对单词而不是整个文本段落起作用。 因此，我希望一些文本从白色开始，然后随着段落的结尾逐渐变黑。 我真的不确定是否可以完成…也许有一个Java脚本可以做到。 谢谢。 问题答案： 您可以使用CSS来做到这一点，但它仅在webkit浏览器（Chrome和
-
当我们讨论CSS渐变时，准确讲是颜色的渐变。 渐变色彩实际上不是颜色（color），而是图像（image）对象，通常用来作为元素背景。 这个特殊图像没有内在的尺寸和比例，它具体的大小将匹配其关联的HTML元素。 CSS中有两种类型的渐变： 线性（linear）：颜色在直线方向从一个点到另一个点的变化。 径向（radials）：颜色从圆心到圆周全方向的变化。 线性渐变（linear-gradient