Question

我正在使用此代码，它在Chrome和Firefox中运行良好，但在IE9中运行不正常。并根据此页面在IE9中支持Multiple background和background-size

span.select {
    position: absolute;
    bottom: 0;
    float: left;
    left: 0;
    line-height: 1;
    text-indent: 10px;
    background: #ffffff;
    background: url(../img/color-arrow.png) no-repeat, linear-gradient(top, #ffffff 0%,#a9a9a9 100%);
    cursor: default;
    z-index: 1;
    border: #dadada 1px solid;
    border-radius: 4px;
    background-position: 100% center;
    background-size: 1.5em 0.6em, 100% 100%;
    text-shadow: 0px 1px 1px #fff;
    white-space: nowrap }

我正在使用多个背景和背景调整大小

Answer 1

IE9 Doesn't support gradients. IE10 supports them unprefixed。 IE9确实实现了SVG。

我建议使用colorzilla's gradient editor。要使用SVG作为后备，只需选中“IE9支持”复选框。

如果你真的需要IE8中的渐变（你不应该使用它们，因为它们应该仅用于渐进式增强），你可以使用IE's proprietary filter property，但要小心，因为它非常错误。

Answer 2

IE9支持多种背景图像，但不支持多种背景元素的混合。你的问题是图像和渐变。

另外-ms-对任何属性的CSS兼容性都没有做任何事情。

IE 9 CSS渐变与背景中的图像不起作用

2 个答案: