插件：html5shiv.js 让IE9以下版本支持html5新标签，git地址https://github.com/aFarkas/html5shiv

用于解决IE9以下版本浏览器对HTML5新增标签不识别，并导致CSS不起作用的问题。所以我们在使用过程中，想要让低版本的浏览器，即IE9以下的浏览器支持，那么这款html5shiv.js是一个非常好的选择！

使用方法，在<head>内添加如下代码：

<!--[if lt IE 9]>

	<script src="bower_components/html5shiv/dist/html5shiv.js"></script>

<![endif]-->

上面这段代码仅会在IE浏览器下运行，还有一点需要注意，在页面中调用html5shiv.js文件必须添加在页面的head元素内，因为IE浏览器必须在元素解析前知道这个元素，所以这个js文件不能在页面底部调用。

插件：Respond.js让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持媒体查询。git地址https://github.com/FOmaerl/Respond.js

响应式布局，理想状态是，对PC/移动各种终端进行响应。媒体查询的支持程度是IE9+以及其他现代的浏览器，但是IE8在市场当中仍然占据了比较大量的市场份额，使我们不得不进行IE低端浏览器的考虑。那么如何在IE6~8浏览器中兼容响应式布局呢？ 这里我们需要借助这样一个文件：respond.js.

Respond.js 是一个快速、轻量的 polyfill，用于为 IE6-8 以及其它不支持 CSS3 Media Queries 的浏览器提供媒体查询的 min-width 和 max-width特性，实现响应式网页设计（Responsive Web Design）。

使用方法：

<!--[if lt IE 9]>

	<script src="js/respond.js"></script>

<![endif]-->

引入到css文件后面，且越早引入越好，这样在IE下面看到页面闪屏的概率就越低，因为最初css会先渲染出来，如果respond.js加载得很后面，这时重新根据media query解析出来的css会再改变一次页面的布局等，所以看起来有闪屏的现象.

插件:excanvas.js ,IE8 及以下的浏览器不兼容 canvas，可以使用 ExplorerCanvas 做兼容性的替代。git地址：https://github.com/yinso/excanvas

使用方法，最好在<head>标签内引入下面代码

<!--[if IE]>
       <script type="text/javascript" src="excanvas.js"></script>
<![endif]-->

html中的canvas标签必须写在excanvas初始方法之后，即：canvas必须在excanvas初始完成后生成，因此最好把excanvas.js引入到<head>内

解决低版本IE关于html5新特性的兼容性问题html5shiv.js和Respond.js，以及excanvas.js解决低版本IE不支持canvas的问题的更多相关文章

  1. html5新特性

    这一篇博文不会告诉你怎么去使用html5的新特性,只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录 对于初接触的人来说是一个导向 对于已经接触过的人来说是一个检测你掌握程度的检 ...

  2. HTML5新特性之CSS+HTML5实例

    1.新的DOCTYPE和字符集 HTML5的一项准则就是化繁为简,Web页面的DOCTYPE被极大的简化. <!DOCTYPE html> 同时字符集声明也被简化了: <meta c ...

  3. xmake v2.1.5版本正式发布，大量新特性更新

    此版本带来了大量新特性更新,具体详见:xmake v2.1.5版本新特性介绍. 更多使用说明,请阅读:文档手册. 项目源码:Github, Gitee. 新特性 #83: 添加 add_csnippe ...

  4. web全栈架构师[笔记] — 03 html5新特性

    HTML5新特性 一.geolocation PC端 精度比较低 通过IP库定位 移动端 通过GPS window.navigator.geolocation 单次 getCurrentPositio ...

  5. HTML5新特性：范围样式

    原文出处:http://blog.csdn.net/hfahe/article/details/7381141        Chromium 最近实现了一个HTML5的新特性:范围样式,又叫做< ...

  6. html5新特性与用法大全了解一下

    有好多小伙伴私聊我问我html5新特性 和用法,下面我给大家具体介绍一下html5都新加了哪些新特性,下面我给大家总结一下. 1)新的语义标签 footer header 等等2)增强型表单 表单2. ...

  7. html5新特性contenteditable 属性更容易实现动态表单

    介绍html5新特性的一个属性:contenteditable 作用域全局.所有的块标签都可以,例如:span.p.div.td等标签.但是,不可以作用域<br/>类型的标签. conte ...

  8. 前端进阶系列(三):HTML5新特性

    HTML5 是对 HTML 标准的第五次修订.其主要的目标是将互联网语义化,以便更好地被人类和机器阅读,并同时提供更好地支持各种媒体的嵌入.HTML5 的语法是向后兼容的.现在国内普遍说的 H5 是包 ...

  9. 转: HTML5新特性之Mutation Observer

    转: HTML5新特性之Mutation Observer Mutation Observer是什么 Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动 ...

随机推荐

  1. idea内存不足或过大闪退

    昨天在码云找了个开源后台项目https://gitee.com/shuzheng/zheng,各种修改后终于跑起来了, 运行没多久就提示内存不足,安装目录配置虚拟机最大可用内存为512M idea弹窗 ...

  2. vue cli脚手架使用

    1.安装nodejs,npm https://www.cnblogs.com/xidianzxm/p/12036880.html 2.安装vue cli sudo npm install -g @vu ...

  3. uwsgi+nginx部署django项目

    1. 概念解析(wsgi协议,uwsgi协议,uWSGI) 参考:https://www.cnblogs.com/wspblog/p/8575101.html 1.1 现实世界的web请求: 1.2  ...

  4. linux调用库的方式

    linux调用库的方式有三种:1.静态链接库2.动态链接库3.动态加载库 其中1,2都是在编程时直接调用,在链接时加参数-l进行链接,运行时自动调用第三种需要在编程时使用dlopen等函数来获取库里面 ...

  5. SQL优化 | sql执行过长的时间，如何优化?

    1.查看sql是否涉及多表的联表或者子查询,如果有,看是否能进行业务拆分,相关字段冗余或者合并成临时表(业务和算法的优化) 2.涉及链表的查询,是否能进行分表查询,单表查询之后的结果进行字段整合 3. ...

  6. [idea][转]理解 IntelliJ IDEA 的项目配置和Web部署

    1.项目配置的理解 IDEA 中最重要的各种设置项,就是这个 Project Structre 了,关乎你的项目运行,缺胳膊少腿都不行.最近公司正好也是用之前自己比较熟悉的IDEA而不是Eclipse ...

  7. Build Telemetry for Distributed Services之Open Telemetry简介

    官网链接:https://opentelemetry.io/about/ OpenTelemetry is the next major version of the OpenTracing and  ...

  8. Ubuntu 18.04设置1920*1080

    Ubuntu升级后,发现分辨率没有1920*1080,在网上寻找了一个文章解决办法如下. 方案一(临时性,重启会失效): 1.打开终端.输入:cvt 1920 1080 出现有modeline 的提示 ...

  9. MySQL truncate()函数的使用说明

    1.TRUNCATE()函数介绍 TRUNCATE(X,D) 是MySQL自带的一个系统函数. 其中,X是数值,D是保留小数的位数. 其作用就是按照小数位数,进行数值截取(此处的截取是按保留位数直接进 ...

  10. 生命周期和Zend引擎

    一切的开始:SAPI接口 SAPI(Server Application Programming Interface)指的是具体应用的编程接口.PHP脚本要执行有很多种方式,通过web服务器,或者直接 ...