1

我想知道 IE8 及以下版本对 CSS 中的媒体查询有何反应。

我不是在寻找 IE8 的解决方案来呈现它们。我只是想知道 IE 是否会忽略它们,或者 IE 是否会尝试解析它们。

背景故事:我们正在构建一个响应式网站,但由于 IE8 及以下版本很少在小屏幕设备上使用,我们希望 IE 忽略媒体查询。这样,IE8(及以下)用户总是看到网站的“常规大小”版本,这很好。

4

2 回答 2

3

简而言之,你完全正确。

IE8 不支持媒体查询,并且不会解析其中包含的任何 CSS。

因此,如果您想在响应式站点中支持 IE8,您应该确保您希望 IE8 使用的默认 CSS 不在任何媒体查询范围内。

因此,简短的回答是,您在问题中所说的几乎完全正确。

当然还有其他的考虑:IE8 并不是唯一不知道媒体查询的浏览器。一些较旧的 Android 设备和其他旧手机也可能不支持它们。如果您需要支持这些设备,您可能需要考虑如何处理它。幸运的是,使用这些设备浏览网页的人并不多,因此您通常可以忽略它们,除非您有特殊需要。

您还可以选择使用像Respond.js这样的 polyfill 脚本,它为 IE8 等旧版浏览器添加了对媒体查询的支持。请注意,这是一个 javascript 库,所以它只会在页面加载后运行,因此可能会有一些延迟和屏幕重绘,这不是很漂亮,但它被很多网站使用并且效果很好,所以你可能要考虑它。

于 2013-10-30T09:43:35.110 回答
-1

ie 8 不支持媒体查询,但是这些多边形填充使媒体查询支持 ie 8 和 ie 7。事实上,使用它是一个不错的选择,否则您需要显示网站的“常规大小”版本?它可能通过一些技巧,即css链接文件的条件注释以及为旧浏览器编写css代码的方式,尝试覆盖具有高css特异性的样式。

注意:如果您使用的是 html5,请添加另一个由 google 托管的polyfill Html5shiv

像这样使用 html5 和媒体查询:

<!--[if lt IE 9><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">            </script>
<script src="js/respond.min.js"></script>
<![endif]-->

检查 polyfills respondjs --- http://responsejs.com/ 和 css3 媒体查询 --

https://code.google.com/p/css3-mediaqueries-js/

为了使用“常规尺寸”版本。

<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="ie8.css" />
<![endif]-->

了解一些规格和提示,技巧登录http://www.pointmycode.com/

于 2013-10-30T10:38:40.783 回答