Question

谈到渐变，我们有很多选择可供选择： 1- Css3 2- SVG 3-图像可能有更多的选择，但这些是最常见的。如果渐变是线性的，那么它在IE旧版本中会优雅地降级，但在这里我所说的是用css3制作的径向渐变。这是它的css：

background: #7d7e7d;
background: -moz-radial-gradient(center, ellipse cover,  #7d7e7d 0%, #0e0e0e 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e));
background: -webkit-radial-gradient(center, ellipse cover,  #7d7e7d 0%,#0e0e0e 100%);
background: -o-radial-gradient(center, ellipse cover,  #7d7e7d 0%,#0e0e0e 100%);
background: -ms-radial-gradient(center, ellipse cover,  #7d7e7d 0%,#0e0e0e 100%);
background: radial-gradient(center, ellipse cover,  #7d7e7d 0%,#0e0e0e 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=1 );

要进行实时演示，您可以看到此页http://bloghutsbeta.blogspot.com/

现在我要求解决这个问题，就好像你在IE中看到那个演示页面那样你可以看到径向渐变的显示方式并不好。如果我使用的图像太大，我的图像不能超过5KB。如果我使用SVG，那么我们都知道它在浏览器中的支持。一个好的建议将不胜感激。

Answer 1

我建议使用Image，因为我没有看到另一个选项。

Answer 2

我会考虑仅针对IE并使用SVG this tool can generate。如果您需要支持“较旧”版本（如标题所示），则可能需要一些库this article talks about。

IE旧版本的Css3 Radial Gradient替代品

2 个答案: