3

由于 Boilerplate 内置了 respond.js,理论上它应该能够支持以下 css:

@media only screen and (max-height: 580px){.rnd-class{:height:200px !important;}}

在 FF 和 Chrome 中,它按预期工作,并且在调整浏览器窗口大小后自定义样式启动。

但是,在 IE8 中,自定义样式始终处于启用状态——无论当前浏览器窗口有多大。

我在想问题出在我的代码中的某个地方,但是当我访问了Boilerplate 移动模板时,我注意到它在 Browser rezize 上的布局也发生了变化,并且它使用了来自默认 Boilerplate 的相同媒体查询。

但是,即使是移动样板也只能与 FF 和 Chrome 一起使用。使用 IE8 访问它,媒体查询不启动,我得到了最小设备的版本。

现在我的问题是:你们在 IE8 中是否有同样的体验?该站点如何在 IE8 中查找您,它是否会根据当前浏览器窗口大小更改其样式?

还是可能与我的特定 IE 版本有关?(我现在不能在另一个 IE 版本上测试它)。

也许,只是也许,some1 知道解决这个问题的方法吗?

PS 我目前正在使用 HTML5 Boilerplate 附带的默认“Modernizr”(内置 respond.js)脚本。

4

5 回答 5

1

首先,您提到您无法访问其他版本的 IE,您看过IETester吗?使用这个工具,我看到了与您相同的行为,即 IE8 不会更改样式以响应窗口大小的变化。IE9 correclty 显示缩小窗口大小时调整主标题的大小。

于 2011-11-23T10:17:09.810 回答
0

根据http://caniuse.com/css-mediaqueries,IE8不支持媒体查询。但是您可以构建自定义 Modernizr,包括 MQ polyfil (respond.js) 以在此(和更旧的)浏览器中启用 MQ。

于 2011-11-23T10:04:31.703 回答
0

Respond.js 仅适用于面向宽度的媒体查询;所以,它不适用于最大高度。我目前也在寻找解决方案。

编辑:我找到了解决方案。

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

有条件地为脚本 IE8 及以下版本加载。你应该准备好了!

于 2011-11-30T17:37:55.423 回答
0

我写了一个补丁,可以使用 respond.js 启用 min-height 和 max-height 媒体查询

希望它尽快集成:https ://github.com/scottjehl/Respond/pull/96

于 2012-01-23T17:05:30.443 回答
0

我找到了一个不使用 javascript 的修复程序。

我遇到了同样的问题,但只有当我的媒体查询保存在单独的 .css 文件中时。这意味着如果我将它们保存在它们在 IE8 中工作的 html 中。很奇怪,但出于某种原因它可以工作。这并不理想,但至少我解决了它,所以如果有人知道为什么会发生这种情况或者我可以做些什么来将我的 css 保存在一个单独的文件中,请告诉我!

于 2013-01-12T01:33:57.187 回答