【问题标题】:How to work with gradients in CSS / list of online CSS gradient generators [closed]如何在 CSS 中使用渐变/在线 CSS 渐变生成器列表 [关闭]
【发布时间】:2025-12-10 03:30:01
【问题描述】:

我有一个渐变的 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 */

生成蓝色系列渐变。

我的问题是:如果我想让蓝色的对应物说绿色或红色怎么办。 最好的方法是什么?我尝试使用颜色选择器,但结果完全不同。

有没有网站可以帮你做?

【问题讨论】:

  • 你试过谷歌搜索“CSS渐变生成器”吗?

标签: html css color-scheme


【解决方案1】:

那里有各种网站,可帮助您通过简单的用户界面生成 CSS 渐变并输出生成的 CSS 代码,例如:

[*] (可以导入现有的 CSS 代码)

[#] (可以导入带有渐变的现有图像)

重新调整 CSS 导入功能: 通常,您只需输入一个特定于浏览器的 CSS 渐变命令。但请注意,并非所有网站/生成器都可以处理所有浏览器格式(Mozilla、Webkit、Opera、W3C 和 IE)。

【讨论】:

  • @SearchForKnowledge 我会更新我的答案。
  • 哇,太好了。当他们说从 CSS 导入时,我想是直接输入渐变代码还是整个 CSS?
  • colorzilla 效果很好。谢谢!!!!!!!!!救生员!
  • @SearchForKnowledge 通常,只有一个渐变 CSS 命令(用于一种类型的浏览器)。
  • @SearchForKnowledge 我刚刚用 CSSMATIC 尝试了你的-moz-linear-gradient,它完美地工作。但正如我所写:并非每个导入器都可以处理所有渐变格式。