如何在CSS /在线CSS梯度生成器列表中使用渐变

Question

我有一个渐变的CSS代码，如下所示：

/*Gradient*/
background: #0345A9; /* Old browsers */
background: -moz-linear-gradient(top, #0345A9 0%, #032E8F 44%, #001A6E 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0345A9), color-stop(44%,#032E8F), color-stop(100%,#001A6E)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #0345A9 0%,#032E8F 44%,#001A6E 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #0345A9 0%,#032E8F 44%,#001A6E 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #0345A9 0%,#032E8F 44%,#001A6E 100%); /* IE10+ */
background: linear-gradient(top, #0345A9 0%,#032E8F 44%,#001A6E 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0345A9', endColorstr='#001A6E',GradientType=0 ); /* IE6-9 */

生成蓝色系列渐变。

我的问题是：如果我想要获得蓝色的对应物，可以说绿色或红色。 最好的方法是什么？我尝试使用颜色选择器，但它完全不同。

是否有适合您的网站？

Answer 1

有各种各样的网站可以帮助您通过简单的用户界面生成CSS渐变并输出生成的CSS代码，例如：

• http://www.colorzilla.com/gradient-editor/ [*] [＃]
• http://www.css3factory.com/linear-gradients/
• http://ie.microsoft.com/TEStdrive/Graphics/CSSGradientBackgroundMaker [*] （始终需要background-image: ...]
• http://css3gen.com/gradient-generator/
• http://www.cssmatic.com/gradient-generator [*]

[*] （可能导入现有的CSS代码）

[＃] （可以使用渐变导入现有图像）

重新定义CSS导入功能：通常，您只需输入一个特定于浏览器的CSS渐变命令。但请注意，并非所有网站/生成器都可以处理所有浏览器格式（Mozilla vs. Webkit vs. Opera vs. W3C vs. IE）。