Drupal 7 Zen 子主题 IE8 响应性答案

【问题标题】：Drupal 7 Zen sub theme IE8 ResponsivenessDrupal 7 Zen 子主题 IE8 响应性
【发布时间】：2013-02-06 22:12:34
【问题描述】：

使用 Drupal 7 的 Zen 入门主题，我创建了这个网站：www.nettango.com。一切似乎都很好，我一直在解决问题。然而，我一直试图让 IE8 尊重响应式风格。这是我所做的：

网站设置：
已选中 - 添加 Respond.js JavaScript 以将基本的 CSS3 媒体查询支持添加到 IE 6-8。
已选中 - 添加 HTML5 shim JavaScript 以添加对 IE 6-8 的支持。
选中 - 添加元标记以支持移动设备上的响应式设计。

这会付诸行动：

<script src="/themes/zen/js/html5-respond.js"></script>

脚本正在加载，但它不服从我的媒体查询。

之后，我将 Zen 的脚本替换为以下内容：

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

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

效果相同 - 没有。

这是我的 css 文件中的一个示例，用于显示如何设置媒体查询：

@media screen and (max-width:1100px) {
    html{font-size: 83%;}
    #header {background:blue;}
}

请随意检查www.nettango.com 站点文件。我花了我一天的大部分时间试图解决这个问题，但没有运气。

提前感谢您的帮助。

【问题讨论】：

标签： drupal internet-explorer-8 media-queries drupal-theming drupal-zen

【解决方案1】：

这很可能是因为您在开发模式下尝试使用 css3-mediaqueries。 Drupal 7 在非 CSS 聚合模式下对样式表使用 @import 规则。

来自the css3-mediaqueires.js project summary：

注意：不适用于 @import'ed 样式表...

因此，css3-mediaqueries.js 只会在 CSS 聚合开启时生效（在生产中）。

【讨论】：

【解决方案2】：

似乎媒体查询在实时服务器上工作，但不在我们的本地服务器上。奇怪的。不知道为什么会这样。

【讨论】：

【解决方案3】：

我还注意到您必须在 config.rb 文件中将 firesass 设置为 false。如果启用 Firesass，它将无法在 IE8 中运行。

【讨论】：