0

.lessカスタムグラデーション用のミックスインを含むスタイルシートがあります。それを使用していくつかのグラデーションを作成すると、他のすべてのブラウザーのルールは正常に表示されますが、filter古いIEブラウザーのルールは最初の呼び出し後に変更されません。

これは、私が問題を再現するために管理した簡略化された例です。

.myGradient(@bg: rbg(255,255,255), @start: #FFFFFF, @end: #E6E6E6) {
        background: @start;
        background: -webkit-linear-gradient(top, @start 0%,@end 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=@start, endColorstr=@end,GradientType=0 );
}

.one {
        .myGradient(#ffa201,#ffa201,#ff7301);
}

.two {
        .myGradient(#aaaaaa,#aaaaaa,#cccccc);
}

.three {
        .myGradient(#ffffff,#ffffff,#000000);
}

によって生成された結果のCSSは次のlessc 1.3.0とおりです。

.one {
  background: #ffa201;
  background: -webkit-linear-gradient(top, #ffa201 0%, #ff7301 100%);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr=#ffa201, endColorstr=#ff7301, GradientType=0);
}
.two {
  background: #aaaaaa;
  background: -webkit-linear-gradient(top, #aaaaaa 0%, #cccccc 100%);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr=#ffa201, endColorstr=#ff7301, GradientType=0);
}
.three {
  background: #ffffff;
  background: -webkit-linear-gradient(top, #ffffff 0%, #000000 100%);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr=#ffa201, endColorstr=#ff7301, GradientType=0);
}

ご覧のとおり、Webkitのグラデーションは期待どおりに機能しますが、IEのグラデーションは常にオレンジ色のままです。何が間違っている可能性がありますか？

4

1 に答える 1

1

試してみてください：

filter: e(%("progid:DXImageTransform.Microsoft.Gradient(StartColorStr='%d', EndColorStr='%d', GradientType=0)",@start,@end));
于 2012-05-24T07:54:04.907 に答える