Question

我在CSS（CSS3）文件中使用以下内容，以便在Internet Explorer中创建渐变：

filter: progid:DXImageTransform.Microsoft.gradient

例如

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#C4D5FB', endColorstr='#DAE6FB'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#C4D5FB), to(#DAE6FB)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #C4D5FB,  #DAE6FB); /* for firefox 3.6+ */

我刚刚读过它自Internet Explorer 9以来已被弃用但仍然有效。使用它安全吗？它有替代品吗？

根据： internet-explorer-9-gradients-with-rounded-corners

使用它是安全的：

像Ultimate CSS Gradient Generator这样的工具会为可爱的CSS3渐变生成所需的代码，并为旧版Internet Explorer提供回退选项（使用上面提到的渐变过滤器）。

谢谢你。

Answer 1

您可以通过传递渐变来使用盒子阴影的插图。我有这个问题而且无法让它发挥作用。所以我看到了这篇文章http://www.sitepoint.com/shadow-boxing-image-free-css3-glossy-buttons/。对我来说很棒。

这是我在项目中使用的代码。

border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;
box-shadow: 3px 3px 6px rgba(0, 0, 0, .2), 0px 0px 3px rgba(0, 0, 0, .1), inset 0px 5px 12px #930, inset 0px 15px 2px rgba(240, 150, 69, .5),inset 0px 25px 25px #930;

Answer 2

试试这个网站

http://www.colorzilla.com/gradient-editor/

检查IE9支持框。它将为您提供SVG解决方案。

filter的替代品是什么：progid：DXImageTransform.Microsoft.gradient

2 个答案: