0

我有一个使用带有断点的媒体查询的响应式网格系统的站点。在 IE8 上，即使屏幕尺寸设置为标准桌面尺寸（大于 960 像素宽），我也将“移动版”视为默认视图。

是否存在会导致这种情况发生的已知问题（和修复）？

一如既往地感谢您的帮助。

- - 编辑 - -

我的媒体查询是如何设置的：

@media screen and (max-width: 767px) {  }
4

2 回答 2

1

IE8 不支持媒体查询，所以它可能正在处理所有的 CSS 规则，即使是全宽屏幕也不应该。

为防止出现此问题，请在每个规则 ( )only后添加关键字。@media@media only screen ...

然后，您可以在所有页面的部分获得支持，包括出色的插件respond.js<head>

于 2012-09-28T14:41:53.183 回答
0

这取决于您如何构建代码（并且由于您没有发布任何内容，因此很难分辨出什么是错误的；））。但一个可能的问题是您首先定义了您的移动布局，并且媒体查询 >960 在 IE8 中不会触发。像这样：

 body { // Default width for all browsers
   width: 300px; 
 }

 @media only screen and (min-width : 960px) { // Only for supporting desktops
   body {
     width: 960px;
   }
 }

（对于不支持它们的浏览器，始终使用“默认”css（没有媒体查询）。）

一种处理方法是默认使用 960px 宽的布局：

 body { // Default width for all browsers
   width: 960px; 
 }

 @media only screen and (min-width : 1400px) { // Widescreen monitors
   body {
     width: 1400px;
   }
 }

 @media only screen and (max-width : 300px) { // Mobile layout
   body {
     width: 300px;
   }
 }

当然，您将不得不指定更多内容，而不仅仅是正文，但这应该会给您一个想法。如果这不能解决问题，请在此处发布您的一些 CSS，以便我们查看。

于 2012-09-29T10:28:34.717 回答