你如何在IE8中使用移动优先

Question

你如何在IE8中使用移动优先

Lui*_*ins 15 internet-explorer-8 singularitygs

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

您是否找到了解决方案或者我必须先切换到桌面？

谢谢.

Answer 1

And*_*aus 36

而不是解决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]-->

Run Code Online (Sandbox Code Playgroud)

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

你需要Selectivizr polyfill.为了响应与Selectivizr一起工作,Selectivizr应该是版本1.0.3b或更高版本(由于某种原因尚未被发布为稳定两年)并且应该在响应之前加载.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]-->

Run Code Online (Sandbox Code Playgroud)

你完全应该有html5shiv polyfill(aka html5shim)来使IE 7-8支持最基本的CSS3东西.

所以我最终的IE 7-8 polyfill套装看起来像这样:

<!--[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]-->

Run Code Online (Sandbox Code Playgroud)

注意:不要将IE9.js与那些结合使用,因为它会使IE 8冻结.

我认为对于一个可怕的(也是非常古老的)浏览器使用可怕的黑客是好的,特别是当你没有额外的50%预算来增加浏览器支持约1%时. (10认同)

Answer 2

Snu*_*gug 7

我使用Breakpoint内置的无查询后备支持与我的HTML标记上的IE类或Mediaizr测试支持媒体查询.

https://github.com/Team-Sass/breakpoint/wiki/No-Query-Fallbacks

归档时间：	12 年，6 月前
查看次数：	12721 次
最近记录：	9 年，10 月前