Internet explorer @IE9桌面浏览器的媒体查询

我在IE9桌面的@media查询中遇到问题。我创建了一个网站，当有人向下调整浏览器大小时，整个布局会根据屏幕大小而改变。整个布局将更改以适应屏幕大小

然而，当涉及到桌面上的IE9时，什么都没有发生。此时将显示为1024分辨率构建的原始布局。因此，任何一个屏幕尺寸为768或更低的人都会看到布局溢出。这对他们来说是不变的

该网站可以在Chorme、Firefox甚至Opera中运行，但不能在IE9桌面上运行

以下是我的呼吁：

@media screen and (min-width: 768px) and (max-width: 959px){
bunch of settings
}

@media screen and (min-width: 480px) and (max-width: 767px){
bunch of settings
}

@media screen and (max-width: 320px) {
bunch of settings
}

^^^当我向下调整浏览器大小时，IE9无法识别这些

---

请提供帮助。

从IE9开始，CSS3媒体查询就受支持，因此您的媒体查询应该可以正常工作。我的直接猜测是你已经打开，关闭它，你的媒体查询应该可以工作

@media screen and (max-width: 320px) {
   bunch of settings
}

@media screen and (min-width: 480px) and (max-width: 767px){
   bunch of settings
}

@media screen and (min-width: 768px) and (max-width: 959px){
   bunch of settings
}

我已将您的最终媒体查询更新为：

@media screen and (max-width: 479px) {
    bunch of settings
}

我的猜测是，当你调整ie9浏览器的大小时，它永远不会达到320的最大宽度。它被卡在320和480之间的某个位置，这意味着你的媒体查询设置都不满足-因此它默认为1024个。将最大宽度更改为仅比上一个视口的最小宽度480-1=479低一个，将解决此问题

---

或者，ie9无法识别查询中的规则中肯定存在一些问题，但其他浏览器没有问题。

CSS3媒体查询从ie9开始就受支持，因此您的媒体查询应该可以工作。我的直接猜测是你已经打开，关闭它，你的媒体查询应该可以工作

@media screen and (max-width: 320px) {
   bunch of settings
}

@media screen and (min-width: 480px) and (max-width: 767px){
   bunch of settings
}

@media screen and (min-width: 768px) and (max-width: 959px){
   bunch of settings
}

我已将您的最终媒体查询更新为：

@media screen and (max-width: 479px) {
    bunch of settings
}

我的猜测是，当你调整ie9浏览器的大小时，它永远不会达到320的最大宽度。它被卡在320和480之间的某个位置，这意味着你的媒体查询设置都不满足-因此它默认为1024个。将最大宽度更改为仅比上一个视口的最小宽度480-1=479低一个，将解决此问题

---

或者，在ie9无法识别的查询中，您的规则中肯定存在一些问题，但其他浏览器没有问题。

ie9确实支持媒体查询。把订单调换一下，他们就可以工作了

@media screen and (max-width: 320px) {
   bunch of settings
}

@media screen and (min-width: 480px) and (max-width: 767px){
   bunch of settings
}

@media screen and (min-width: 768px) and (max-width: 959px){
   bunch of settings
}

---

IE9确实支持媒体查询。把订单调换一下，他们就可以工作了

@media screen and (max-width: 320px) {
   bunch of settings
}

@media screen and (min-width: 480px) and (max-width: 767px){
   bunch of settings
}

@media screen and (min-width: 768px) and (max-width: 959px){
   bunch of settings
}

---

我在IE9中测试了兼容性视图的打开和关闭。当我改变桌面上浏览器的大小时，布局没有改变。很奇怪，我在JSFIDLE上组装了一些东西，并在ie9上进行了测试，它工作正常-请注意我的答案中的变化，因为我确实对您的媒体查询做了一个改变..您也可以在这里检查小提琴：我在ie9中测试了兼容性视图的打开和关闭。当我改变桌面上浏览器的大小时，布局没有改变。很奇怪，我在JSFIDLE上组装了一些东西，并在ie9上进行了测试，它工作正常-注意我的答案中的变化，因为我确实对你的媒体查询做了一点改变..你也可以在这里检查小提琴：我在CSS文件中做了这件事，但这也没有解决问题。当我缩小浏览器的尺寸时，布局没有改变。你使用html5 doctype吗？我在CSS文件中这样做了，但这也没有解决问题。当我缩小浏览器的尺寸时，布局不会改变。你在使用html5 doctype吗？我也有这个问题。问题不是IE9无法理解媒体查询，而是IE9无法理解。当浏览器调整大小而不刷新窗口时，它不会重新应用规则。我也有这个问题。问题不是IE9无法理解媒体查询，而是IE9无法理解。它只是在调整浏览器大小而不刷新窗口时不会重新应用规则。