Twitter Bootstrap 320andup Implementation

此生再无相见时 提交于 2019-12-22 14:59:26

问题


I'm creating a site using the Twitter Bootstrap, but I've discovered that the media queries don't work on anything below IE9 (unfortunately my target browser). This deeming the whole reason I'm using the bootstrap (for the responsive scaling grid) pretty useless.

I was considering the implementation of Andy Clarke's 320 and up responsive boilerplate within the bootstrap for the general better overall support on the IE side of things. (Or similar boilerplates)

Has anyone come across any examples of this being done online or on Github? (without the likes of SASS, HAML etc or being specifically created for a CMS). I have an idea of how I'm going to do it, but I'm not sure if it's a waste of time and I'd like to see if both tools can be pulled together successfully.


回答1:


@fitzilla... I couldn't figure out how to add an additional comments, so I hope you find this. I just checked my website in both IE7 & IE8 mode and both work. Do a view source on the initial page - you will see an additional hack for IE7 & IE8...

<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

Then check your includes against mine and see if they match. I believe the bootstrap-responsive has to be after the regular bootstrap css file.




回答2:


In order for media queries to function in older browsers (IE7 and 8) you need to include a polyfill such as the respond.js in the body of your document to support those techniques. Just noticed that the 320andup framework uses the same polyfill so you can easily include it in your bootstrap project.

Here is a test page that you can use to test the queries on IE7 and 8:

http://chrisjacob.github.com/Respond/




回答3:


Respond.js will make Bootstrap work for both IE7 & IE8 - at least using the developer tools (F12) of IE9. On my test site (http://ReactiveWebDesign.Net I include respond.js just before jQuery... the first included .js file



来源:https://stackoverflow.com/questions/9976613/twitter-bootstrap-320andup-implementation

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!