Css 目标IE11和屏幕宽度同时调整_Css_Media Queries_Internet Explorer 11

Css 目标IE11和屏幕宽度同时调整

css

Css 目标IE11和屏幕宽度同时调整,css,media-queries,internet-explorer-11,Css,Media Queries,Internet Explorer 11,我需要针对IE11和特定断点，因为有些东西在IE11上不能正常工作。我知道我需要的CSS编辑，但我不能找出媒体查询，以适当的目标IE和屏幕大小同时进行我尝试了下面的代码和每个代码的多种变体我的问题是这里出了什么问题，我该如何解决这个问题以使其正常工作 @media screen and (-ms-high-contrast: active) and (min-width: 1200px), screen and (-ms-high-contrast: none) and (mi

我需要针对IE11和特定断点，因为有些东西在IE11上不能正常工作。我知道我需要的CSS编辑，但我不能找出媒体查询，以适当的目标IE和屏幕大小同时进行

我尝试了下面的代码和每个代码的多种变体

我的问题是这里出了什么问题，我该如何解决这个问题以使其正常工作

@media screen and (-ms-high-contrast: active) and (min-width: 1200px),
       screen and (-ms-high-contrast: none) and (min-width: 1200px) {
          .scene-info {
               CSS GOES HERE
       }
}


@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none), screen and (max-width: 991px) {
       .scene-info {
            left: 1px;   
       }
}

请尝试按以下方式修改您的代码：

<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
        .scene-info {
            background-color: red;
        }

        @media screen and (-ms-high-contrast: active) and (min-width: 1200px), screen and (-ms-high-contrast: none) and (min-width: 1200px) {
            .scene-info {
                background-color: palegreen;
            }
        }

        @media screen and (-ms-high-contrast: active) and (max-width: 991px), screen and (-ms-high-contrast: none) and (max-width: 991px) {
            .scene-info {
                left: 1px;
                background-color: aqua;
            }
        }
    </style>
</head>
<body>
    <p>This is a reference p.</p>
    <p class="scene-info">This then, is the test itself.</p>
</body>


.场景信息{
背景色：红色；
}
@介质屏幕和（-ms高对比度：激活）和（最小宽度：1200px），屏幕和（-ms高对比度：无）和（最小宽度：1200px）{
.场景信息{
背景颜色：淡绿色；
}
}
@媒体屏幕和（-ms高对比度：活动）和（最大宽度：991px），屏幕和（-ms高对比度：无）和（最大宽度：991px）{
.场景信息{
左：1px；
背景色：浅绿色；
}
}
这是一个参考页
这就是测试本身

输出如下所示：

有关css媒体的更多详细信息，请查看。

您的第一个示例在IE11中适用。