IE6-8的响应式布局问题@media

用@media处理手机和pc端界面兼容的问题，在IE 上的访问出现问题，百度方法，找找两种，一种是respond.js，另一种是css3-mediaqueries.js

一 respond.js 

地址：http://www.bootcdn.cn/respond.js/

使用时respond.js需要注意的问题：

1 需要外部引入CSS文件，将CSS样式书写在style中是无效的；（亲身体会，直接style无效果的）

2 由于respond插件是查找CSS文件，再进行处理，所以respond文件一定要放置在CSS文件的后面

3 最好不要为CSS设置utf-8的编码，使用默认

respond.js工作原理

1，将head中所有外部引入的CSS文件路径取出来存储到一个数组当中；

2，遍历数组，并一个个发送AJAX请求；

3，AJAX回调后，分析response中的media query的min-width和max-width语法（注意，仅仅支持min-width和max-width），分析出viewport变化区间对应相应的css块；

4，页面初始化时和window.resize时，根据当前viewport使用相应的css块。

respond.js总结（别人总结的，摘抄的）

• 优点：压缩后仅1k,不跨域时性能ok，只需引入respond.js通用易用
• 缺点：仅支持media query的min-width和max-width（用于响应式够用）；支持跨域，虽然配置有点麻烦，实现跨域代价高而且有闪屏体验欠佳。

二、css3-mediaqueries.js

使用时css3-mediaqueries.js需要注意的问题：

@Media必须写在html当前页面中，外部引入无效,别人说的，没有亲自试验

没有使用这种方式，不再多说。