CSS3 验证器在渐变代码上显示 5 错误答案

【问题标题】：CSS3 Validator shown 5 error on Gradient codeCSS3 验证器在渐变代码上显示 5 错误
【发布时间】：2012-05-19 17:04:40
【问题描述】：

当我尝试通过 CSS3 W3.org Validator 验证我的 Gradient css 时显示错误

对不起！我们发现了以下错误（5）

我的代码是

background: linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);

错误http://www.freeimagehosting.net/uy82i

【问题讨论】：

这里有问题吗？也许您的问题没有得到回答的原因是因为我们不知道您想让我们告诉您什么。添加赏金并没有真正的帮助。
当我尝试通过 CSS3 W3.org Validator 验证我的 Gradient css 时显示错误？这是一个问题，因为当客户端检查验证站点时发生此错误，他告诉我解决此问题我不知道为什么 css3 验证显示此错误。
body{background: linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);} 表示 linear-gradient 不是 background-color 值...

标签： css

【解决方案1】：

Rizwan，首先，您使用的网站http://jigsaw.w3.org/css-validator/#validate_by_input 不完全支持 CSS3。

发件人：About the CSS Validator

那么，这就是关于什么是正确的 CSS 什么是错误的权威？

没有。它是一个有用且可靠的工具，但也是一个软件工具，就像每个软件，它都有一些错误和问题。实际参考级联样式表是 CSS 规范。

默认情况下，此验证器会根据语法检查样式表， CSS 2.1 规范中定义的属性和值，但其他可以使用选项检查 CSS 配置文件。

如果您查看bugs and issues，您会发现一个错误：linear-gradient as a background-image，它无法识别线性渐变。

-webkit-gradient 是特定于浏览器的，w3.org 验证器将无法识别它。

最后的建议，不要过分依赖验证器，它们可能会帮助您发现错误，但它们并非 100% 正确。对于 CSS3，最好在浏览器中测试这些属性并查看它们是否正常工作。

【讨论】：

【解决方案2】：

W3 渐变在 -webkit-gradient 上会出现错误，因为它仅由 Google chrome w3.org 支持，仅验证在所有浏览器中验证的样式，如字体、宽度、高度

【讨论】：

我没有使用 webkit 渐变我的代码是... 背景：linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);

【解决方案3】：

你所拥有的一切都很好。它引发这些错误的唯一原因是它尚未最终确定，因此验证者认为这不存在。您可以从impressivewebse.com 尝试不同的浏览器支持。如果你这样做，它会在网站上运行它只是不会认为它在验证器中是正确的，因为那个命令的东西还没有最终确定。希望这有帮助！伊桑·布劳尔

【讨论】：

渐变在所有浏览器中都可以正常工作，但我想知道为什么 w3c Validator 会显示此错误。
W3c 约定尚未最终确定线性渐变属性。这就是为什么它认为它几乎不是真正的 css 属性，而是它不理解的文本。 W3c 很慢。

【解决方案4】：

听听人们在告诉你什么；线性渐变还不是 CSS3 规范的一部分，因此它被正确地标记为无效代码。

多个浏览器已经实现了自己的标签版本（moz-、webkit- 等），因此他们可以及早提供这些功能。一旦线性渐变完全设计并被 CSS3 规范接受，这些供应商特定的前缀将消失，线性渐变在 W3C 验证工具中将不再无效。

在此之前，您所能做的就是提供特定于供应商的标签、一个 CSS3 标准标签和一个旧的浏览器后备。此外，根据您的判断，与您的客户进行友好的聊天可以大有帮助。试着解释一下你正在使用的前沿代码确实为使用旧浏览器的用户提供了一个优雅的回退（对吗？）。

【讨论】：

【解决方案5】：

它显示一个错误，因为-webkit-gradient 不是由 CSS3 定义的。它特定于基于 WebKit 的浏览器，例如 Chrome。

尝试改用linear-gradient。但是，目前我所知道的浏览器都不支持它。

以-webkit-、-moz-、-o- 或-ms- 开头的任何内容都特定于浏览器。他们这样做是为了支持尚未最终确定的新功能或规范。

http://www.colorzilla.com/gradient-editor/ 是创建跨浏览器渐变的绝佳工具。

【讨论】：

同样的问题。我检查了这个 colorzilla 代码背景：linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* W3C */ 在 w3.org 网站jigsaw.w3.org/css-validator/#validate_by_input查看此代码