internet-explorer-8 - 如何在 IE8 中使用移动优先

标签 internet-explorer-8 singularitygs

考虑到 SingularityGS 默认遵循移动优先的方法,你们如何解决 IE8 中的问题,它显示了所有依赖于媒体查询的移动版本?

您是否找到了解决方案,还是我必须先切换到桌面?

谢谢。

最佳答案

您可以让 IE 7-8 真正支持媒体查询,而不是解决 IE 7 和 8 的缺点!

我用了很棒的Respond.js polyfill 在 IE 7 和 8 中启用媒体查询。只需将此代码添加到您的 HTML <head>你可以走了!

<!--[if lt IE 9]>
  <script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.1.0/respond.min.js"></script>
<![endif]-->

您可能还想在 IE 7 和 8 中启用 CSS3 选择器,以便像 .column:nth-child(#{$i}n) { @include float-span(1, 'last'); } 这样的东西。会工作。

您需要 Selectivizr填充物。要使 Respond 与 Selectivizr 一起工作,Selectivizr 应为 版本 1.0.3b 或更高版本 (由于某种原因尚未发布为稳定的 for two years)并且应该是 在响应 之前加载. Selectivizr 还需要 NWMatcher或替代在它之前加载。所以正确的顺序是这样的:
<!--[if lt IE 9]>
  <script src="//s3.amazonaws.com/nwapi/nwmatcher/nwmatcher-1.2.5-min.js"></script>
  <script src="//html5base.googlecode.com/svn-history/r38/trunk/js/selectivizr-1.0.3b.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.1.0/respond.min.js"></script>
<![endif]-->

你也应该拥有html5shiv polyfill (aka html5shim) 让 IE 7-8 支持最基本的 CSS3 东西。

所以我最终的 IE 7-8 polyfills 看起来像这样:
<!--[if lt IE 9]>
  <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
  <script src="//s3.amazonaws.com/nwapi/nwmatcher/nwmatcher-1.2.5-min.js"></script>
  <script src="//html5base.googlecode.com/svn-history/r38/trunk/js/selectivizr-1.0.3b.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.1.0/respond.min.js"></script>
<![endif]-->

注意:不要使用 IE9.js结合这些,因为它会使 IE 8 卡住。

关于internet-explorer-8 - 如何在 IE8 中使用移动优先,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16720043/

相关文章:

javascript - IE8标签通过javascript更新问题

javascript - "' HTMLDocument ' is undefined"在 IE8 中

css - 如何在某种图片库中对齐 ul 中包含的图像

css - 什么是奇点网格中断点内 float 跨度的正确标记

css - 奇点多个排水沟被忽略

javascript - JsTree 的节点未使用在 IE 中的类型插件中指定的图标

html - Internet Explorer 8 背景色环绕在下方

css - Internet Explorer 8 使用 Retina pixelratio 媒体查询

css - 无法清除两个堆叠的奇点隔离跨度框,否则侧翼框会移动

css - Jeet Grid 与奇点