使用 Internet Explorer 8 进行媒体查询答案

【问题标题】：Media Queries with Internet Explorer 8使用 Internet Explorer 8 进行媒体查询
【发布时间】：2014-11-06 15:04:55
【问题描述】：

我正在尝试使媒体查询在 IE8 上工作（因为我的公司使用它，我知道很遗憾。）我已经找到了像 response.js 这样的东西。令人恼火的是，当我在 IE8 上使用此链接：http://scottjehl.github.io/Respond/test/test.html 时，它可以完美运行......但是！当我下载最新版本的 respond.js 并尝试启动这个完全相同的 test.html 页面时，它不起作用！我没有编辑任何东西，甚至 Scott Jehl 写的测试页也不起作用。在我发疯之前请帮忙。

【问题讨论】：

检查外部文件的路径。我在这里闻到了一些相对路径的惨败。
可能是我的项目的问题，但现在是关于未编辑的响应文件夹...我做错了什么吗？
只需检查test.html 和您下载的respond.js 测试文件的其他文件。可能他们在路径上做错了，并且在本地没有任何作用（或者他们通过互联网引用文件并且您处于离线状态）它在其他浏览器上是否有效？
该文件与 FireFox 完美配合，我目前在线，无论如何，所有 css 和脚本都在文件夹中。我真的不明白。链接到这个文件夹：github.com/scottjehl/Respond/archive/master.zip
@Sharky 代码：我觉得这 3 个链接很好。 ..

标签： javascript html internet-explorer-8 media-queries respond.js

【解决方案1】：

让我们在网上收集一些信息......

在 Bootstrap 的测试文件 http://getbootstrap.com/getting-started/#template 中有一些代码行：

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->

这里的 Drupal 页面 https://www.drupal.org/node/2173441 说：

由于浏览器安全规则，Respond.js 不适用于页面通过 file:// 协议查看（例如打开本地 HTML 文件时）。要测试 IE8 中的响应功能，请通过 HTTP(S) 查看您的页面。看详情请参阅 Respond.js 文档。

所以，让我们开始我们应该从一开始就在哪里...官方文档：D Respond.js doc

...其中说，

据报道，如果 CSS 文件以 UTF-8 编码并带有 Byte-Order-Mark (BOM)，它们不能在 IE7 或 IE8 中与 Respond.js 一起使用。注明在第97期

警告：在媒体查询中包含@font-face 规则会导致 IE7 和 IE8 在加载期间挂起。要解决此问题，请放置 @font-face 公开的规则，作为其他媒体查询的兄弟。

...因此，如果您对respond.js 和ie8 有疑问，请务必快速检查以上所有内容，当然，请阅读官方文档。

也值得一读：http://nextflow.in.th/en/keep-your-responsive-web-design-against-the-legendary-internet-explorer-ie6ie7ie8/using-response-js-to-make-ie6ie7ie8-understand-your-responsive-design/

将 response.js 放在您在网页中使用的所有 CSS 之后。除了你准备好采取奇怪的行动了。

Response.js 与 CDN 和域有关。

【讨论】：

【解决方案2】：

问题解决了！

我必须将我的项目放在网络服务器上才能使其正常工作。仅仅打开 html 文件是不够的。

【讨论】：