CSS 在不同浏览器中改变颜色

Question

我在构建的网站上遇到了一个有点奇怪的错误。

使用 Chrome/Firefox/Safari/IE10 它工作正常。但是用IE9就变成蓝色了!怎么了？

我怀疑这段代码搞砸了(@colorOne、@colorTwo 被实际颜色替换):

.gradient (@colorOne, @colorTwo) {
    background: @colorOne; /* Old browsers */
    background: -moz-linear-gradient(top,  @colorOne 0%, @colorTwo 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@colorOne), color-stop(100%,@colorTwo)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  @colorOne 0%,@colorTwo 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  @colorOne 0%,@colorTwo 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  @colorOne 0%,@colorTwo 100%); /* IE10+ */
    background: linear-gradient(to bottom,  @colorOne 0%,@colorTwo 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@colorOne', endColorstr='@colorTwo',GradientType=0 ); /* IE6-9 */
}

Answer 1

#top 元素和站点内其他元素的 CSS 中有一个蓝色的 Microsoft 过滤器渐变。但是由于您专门询问标题，只需删除:

#top {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@colorOne', endColorstr='@colorThree', GradientType=1);
  /* Remove this from any other element you wish to be green */
}