CSS3 Media QueryIE9前解决方法
对于CSS3 Media Query，IE9之前的版本无法提供支持。目前的最佳解决方法是通过css3-mediaqueries.js来帮助这些旧版本的IE浏览器支持CSS3 media queries。
?
使用代码如下：
?
<!--[if lt IE 9]> <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script><![endif]-->
?
?
css3-mediaqueries.js见附件
官方网站：
https://code.google.com/p/css3-mediaqueries-js/
接下来就可以写CSS3 Media Query样式代码了
/************************************************************************************小于980*************************************************************************************/@media screen and (max-width: 980px) {/* pagewrap */#pagewrap {width: 95%;}/* content */#content {width: 60%;padding: 3% 4%;}/* sidebar */#sidebar {width: 30%;}#sidebar .widget {padding: 8% 7%;margin-bottom: 10px;}/* embedded videos */.video embed,.video object,.video iframe {width: 100%;height: auto;min-height: 300px;}}/************************************************************************************小于650*************************************************************************************/@media screen and (max-width: 650px) {/* header */#header {height: auto;}/* search form */#searchform {position: absolute;top: 5px;right: 0;z-index: 100;height: 40px;}#searchform #s {width: 70px;}#searchform #s:focus {width: 150px;}/* main nav */#main-nav {position: static;}/* site logo */#site-logo {margin: 15px 100px 5px 0;position: static;}/* site description */#site-description {margin: 0 0 15px;position: static;}/* content */#content {width: auto;float: none;margin: 20px 0;}/* sidebar */#sidebar {width: 100%;margin: 0;float: none;}#sidebar .widget {padding: 3% 4%;margin: 0 0 10px;}/* embedded videos */.video embed,.video object,.video iframe {min-height: 250px;}}/************************************************************************************小于480*************************************************************************************/@media screen and (max-width: 480px) {/* disable webkit text size adjust (for iPhone) */html {-webkit-text-size-adjust: none;}/* main nav */#main-nav a {font-size: 90%;padding: 10px 8px;}}?
?
?
?
?
?
?