让 IE9 以下的浏览器支持 Media Queries
1. 如何让 IE9 以下的浏览器支持 css3 的media query 需要用到的 min-width/max-width 属性
css3 的媒体查询 IE 浏览器的支持程度是从 IE9开始支持,那么要想 IE6~IE8 的浏览器支持 媒体查询可以使用 js 来辅助支持。主要可以使用以下两个 辅助 js 文件中的其中一个即可:
1). respond.js
可以从:http://www.bootcdn.cn/respond.js/ 上 通过 cdn 引入
2).css3-mediaqueries.js
可以上 github 上下载然后引入;
对于使用上述的两个 pollify 文件,其优缺点可以在链接:http://stackoverflow.com/questions/12837568/css3-mediaqueries-js-vs-respond-js 看到详细对比。
2. 如和在页面中引入上述两个文件
为了减少页面的 http 请求数量,对于支持 css3 媒体查询的浏览器,则不引入上述的 js 文件,反之则引入。那么如何做到呢,可以参考文章:
http://www.cnblogs.com/thinkingthigh/archive/2013/06/19/3144239.html
3. 有时候会发现,引入了 respond.js, 但是却并没有实现 css3的媒体查询效果呀,这怎么解决呢?可以参考文章:
http://www.cnblogs.com/aimyfly/p/4286626.html
让 IE9 以下的浏览器支持 Media Queries的更多相关文章
- IT兄弟连 HTML5教程 设置IE9以下版本浏览器支持HTML5
HTML2.HTML5刚发布时由于各浏览器之间的标准不统一,开发者的时间都浪费在解决Web浏览器之间的兼容性上.但由于W3C和WHATWG对HTML5新版本的制定,以及近年来对HTML5的使用,再加上 ...
- 【CSS3 入门教程系列】CSS3 Media Queries 实现响应式设计
在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...
- HTML5实践 -- 使用CSS3 Media Queries实现响应式设计
CSS3 Media用法介绍:http://www.w3cplus.com/content/css3-media-queries 转载请注明原创地址:http://www.cnblogs.com/so ...
- css3的媒体查询(Media Queries)
我今天就总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. 先看一个简单的例子: <link rel="stylesheet" media="scr ...
- CSS3学习教程:Media Queries详解
说起CSS3的新特性,就不得不提到 Media Queries . Media Queries 的引入,其作用就是允许添加表达式用以确定媒体的情况,以此来应用不同的样式表.换句话说,其允许我们在不改变 ...
- CSS3 Media Queries 详解
说起CSS3的新特性,就不得不提到 Media Queries .最近 Max Design 更新的一个泛读列表里,赫然就有关于 Media Queries 的文章.同时位列其中的也有前天我刚刚翻译的 ...
- CSS3的媒体查询(Media Queries)与移动设备显示尺寸大全
媒体查询介绍 我今天就总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. 先看一个简单的例子: <link rel="stylesheet" media=&q ...
- 【css】CSS3 Media Queries 详解【转】
说起CSS3的新特性,就不得不提到 Media Queries .最近 Max Design 更新的一个泛读列表里,赫然就有关于 Media Queries 的文章.同时位列其中的也有前天我刚刚翻译的 ...
- 第11章 Media Queries 与Responsive 设计
Media Queries--媒体类型(一) 随着科学技术不断的向前发展,网页的浏览终端越来越多样化,用户可以通过:宽屏电视.台式电脑.笔记本电脑.平板电脑和智能手机来访问你的网站.尽管你无法保证一个 ...
随机推荐
- [代码]--python爬虫联系--爬取成语
闲来无事,玩了个成语接龙,于是就想用python爬取下成语网站上的成语,直接上代码: #coding=utf-8 import requests from bs4 import BeautifulSo ...
- Apache虚拟主机
基本概述 虚拟Web主机 在同一台服务器中运行多个Web站点,其中每一个站点并不独立占用一台真正的计算机 httpd支持的虚拟主机类型 基于域名的虚拟主机 基于IP地址的虚拟主机 基于端口的虚拟主机 ...
- pgm12
作为 inference 部分的小结,我们这里对 machine learning 里面常见的三个 model 的 inference 问题进行整理,当然很幸运的是他们都存在 tractable 的算 ...
- BZOJ2135 刷题计划(贪心+二分)
相邻数作差后容易转化成将这些数最多再切m刀能获得的最小偏差值.大胆猜想化一波式子可以发现将一个数平均分是最优的.并且划分次数越多能获得的偏差值增量越小.那么就可以贪心了:将所有差扔进堆里,每次取出增量 ...
- P2577 [ZJOI2005]午餐
题目描述 上午的训练结束了,THU ACM小组集体去吃午餐,他们一行N人来到了著名的十食堂.这里有两个打饭的窗口,每个窗口同一时刻只能给一个人打饭.由于每个人的口味(以及胃口)不同,所以他们要吃的菜各 ...
- APIO2016赛艇
首先每个学校的边界范围是\(1e9\),肯定不能直接\(dp[i][j]\)表示前i所学校,第\(i\)所学校派出\(j\)艘船,但\(b<=500\)所有考虑把\(a,b\)离散,第二维改为当 ...
- 【转】typedef和#define的用法与区别
typedef和#define的用法与区别 一.typedef的用法 在C/C++语言中,typedef常用来定义一个标识符及关键字的别名,它是语言编译过程的一部分,但它并不实际分配内存空间,实例像: ...
- pip install时遇到MemoryError的原因和处理方法
前言:同学们在用pip install的时候,可能会遇到MemoryError的问题 报错如下,看最后一行的memory error关键字: 报错的原因大致如下:(详细细节可以查看此处) This e ...
- A1077. Kuchiguse
The Japanese language is notorious for its sentence ending particles. Personal preference of such pa ...
- Mac下Vim编辑快捷键小结(移动光标)
Mac下Vim编辑快捷键小结(移动光标) 1.移动到行尾"$",移动到行首"0"(数字),移动到行首第一个字符处"^" 2.移动到段首&qu ...