我有div渐变背景和背景图片。除了ie9之外，它在所有主流浏览器中都很好用。我有两个显示，但我无法弄清楚如何定位背景图像。
在必要时使用适当的浏览器前缀我使用以下内容：
background: url("../images/green-home-icon.png") no-repeat center top 10px, linear-gradient(top, @top-color 0%,@bottom-color 100%);
但是在IE9中我使用filter，因为这是唯一的css方法：
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/green-home-icon.png') progid:DXImageTransform.Microsoft.gradient( startColorstr='@{top-color}', endColorstr='@{bottom-color}',GradientType=0);
有没有办法在IE9中定位背景图像，同时保持渐变，就像我们在其他浏览器中一样？我希望图像以div为中心。我最好不要添加其他元素。
这是 fiddle 。它只有IE9的过滤器。
答案 0 :(得分：1)
我建议使用内联SVG而不是非标准的IE过滤器。它看起来像这样：
background: url("../images/green-home-icon.png") no-repeat center top 10px, url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
JSFiddle：http://jsfiddle.net/Lnqbhag1/
由于看起来你正在使用LESS，我找到了一个LESS mixin，可以为你自动执行此操作：https://gist.github.com/brysongilbert/3895260。我没有测试过mixin，但它看起来应该可以解决这个问题。