IE 未检测到媒体查询和线性梯度

Question

我有以下特定于所有 IE 的媒体查询。当我使用 IE11 或更早版本时，浏览器不会检测到我的媒体查询。

<!--[if IE]>
<style>
   @media screen (min-width:1281px){
    .topleft {
        position: absolute;
        top: 0%;
        left: -16% !important;
    }

    .bgimg {
        width: 69%;
        left: 15%;
    }
}

@media screen (max-width: 1280px){
    .middle1 {
        position: absolute;
        top: 44% !important;
        left: 33% !important;
        width: 38% !important;
        -ms-transform: translate(-50%, -50%);
        text-align: center;
    }
}
</style><![endif]-->

我的第二个问题是我无法在 IE 中正确地进行线性渐变。

我能够在此处找到有关如何完成它的参考。但是，当我执行-ms-linear-gradient(...) 时，它确实会创建渐变，但会覆盖我拥有的背景图像。如何在不使背景图像变黑的情况下实现它？

background-image: url('http://oc2-reatest/OCUpgrade52/images/Stethoscope_ver2.jpg');/*, -ms-linear-gradient(top, #f0f0f0 0%, #f0f0f0 10%);

/*filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#f0f0f0', endColorstr='#f0f0f0');/*For IE7-8-9*/ */

Answer 1

那在您的样式表中吗（即单独的 css 文件）？ （条件 cmets 仅适用于 HTML 文件）

如果不是（即如果它在 HTML 文件中），重要的是它跟在 之后 包括您的通用样式表，否则它将被通用样式覆盖。

还有第三个可能的原因：一般样式中可能存在特定性更高的规则，这些规则会否决您的 IE 媒体查询中的规则。例如，如果有像.container_all .topleft 这样的规则，它将比您的.topleft 规则具有更高的特异性并否决它。为避免这种情况，请在通用样式表中搜索选择器并在媒体查询中使用相同的选择器。