-webkit-linear-gradient 在 Safari 中导致 400（错误请求）错误答案

【问题标题】：-webkit-linear-gradient causes 400 (Bad request) error in Safari-webkit-linear-gradient 在 Safari 中导致 400（错误请求）错误
【发布时间】：2012-03-05 10:59:16
【问题描述】：

我正在使用 Compass 生成线性渐变，但我收到一个奇怪的错误，表明 Safari（版本 5.1.2 [6534.52.7]）正在尝试加载供应商前缀行，就好像它是一个 URI。奇怪！

指南针代码： 身体 { @include 背景图像（线性渐变（顶部，#F7F7F7 0%，#FFFFFF 20%，#cccccc 57%，#dddddd 60%，#f1f1f1 80%，#FFFFFF 100%））； }

生成的 CSS：

background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f7f7f7), color-stop(20%, #ffffff), color-stop(57%, #cccccc), color-stop(60%, #dddddd), color-stop(80%, #f1f1f1), color-stop(100%, #ffffff));
background-image: -webkit-linear-gradient(top, #f7f7f7 0%, #ffffff 20%, #cccccc 57%, #dddddd 60%, #f1f1f1 80%, #ffffff 100%);
background-image: -moz-linear-gradient(top, #f7f7f7 0%, #ffffff 20%, #cccccc 57%, #dddddd 60%, #f1f1f1 80%, #ffffff 100%);
background-image: -o-linear-gradient(top, #f7f7f7 0%, #ffffff 20%, #cccccc 57%, #dddddd 60%, #f1f1f1 80%, #ffffff 100%);
background-image: -ms-linear-gradient(top, #f7f7f7 0%, #ffffff 20%, #cccccc 57%, #dddddd 60%, #f1f1f1 80%, #ffffff 100%);
background-image: linear-gradient(top, #f7f7f7 0%, #ffffff 20%, #cccccc 57%, #dddddd 60%, #f1f1f1 80%, #ffffff 100%);

错误：-webkit-linear-gradient

-webkit-linear-gradient(top,%20rgb(247,%20247,%20247)%200%,%20rgb(255,%20255,%20255)%2020%,%20rgb(204,%20204,%20204)%2057%,%20rgb(221,%20221,%20221)%2060%,%20rgb(241,%20241,%20241)%2080%,%20rgb(255,%20255,%20255)%20100%)
GET http://localhost:8888/-webkit-linear-gradient(top,%20rgb(247,%20247,%20247)%200%,%20rgb(255,%20255,%20255)%2020%,%20rgb(204,%20204,%20204)%2057%,%20rgb(221,%20221,%20221)%2060%,%20rgb(241,%20241,%20241)%2080%,%20rgb(255,%20255,%20255)%20100%) 400 (Bad Request)

错误：-webkit-gradient()

-webkit-gradient(linear,%2050%%200%,%2050%%20100%,%20from(rgb(247,%20247,%20247)),%20color-stop(0.2,%20rgb(255,%20255,%20255)),%20color-stop(0.57,%20rgb(204,%20204,%20204)),%20color-stop(0.6,%20rgb(221,%20221,%20221)),%20color-stop(0.8,%20rgb(241,%20241,%20241)),%20to(rgb(255,%20255,%20255)))
GET http://localhost:8888/-webkit-gradient(linear,%2050%%200%,%2050%%20100%,%20from(rgb(247,%20247,%20247)),%20color-stop(0.2,%20rgb(255,%20255,%20255)),%20color-stop(0.57,%20rgb(204,%20204,%20204)),%20color-stop(0.6,%20rgb(221,%20221,%20221)),%20color-stop(0.8,%20rgb(241,%20241,%20241)),%20to(rgb(255,%20255,%20255))) 400 (Bad Request)

尽管有错误，但渐变渲染正确。整个页面还有许多其他多站线性渐变不会导致错误。看来这是一个 Safari 错误 - 它仅在 .查看一些代码（如果您正在运行 Safari，请实时查看错误）：

任何想法/解决方案将不胜感激。

【问题讨论】：

我在 Safari 版本 5.1.3 (7534.53.10) 中没有看到错误

标签： compass-sass linear-gradients safari

【解决方案1】：

感谢 @maxbeatty 在您的 Safari 版本上进行检查。您的帖子使我进一步深入研究，并禁用了所有插件。我发现罪魁祸首是 Safari AdBlock 插件。禁用它会使错误消失。

【讨论】：