HTML5浏览器支持及兼容性处理
1、现代的浏览器都支持HTML5。
2、所有浏览器不管是新的还是旧的对无法识别的元素会作为内联元素自动处理。
3、HTML5定义了8个HTML语义元素，所有这些元素都是块级元素，为了能让旧版本的浏览器正确显示这些元素，你可以设置css的display属性值为block，如下：
header, section, footer, aside, nav, main, article, figure {
display: block;
}
4、你可以向HTML添加新元素，如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>为 HTML 添加新元素</title>
<script>document.createElement("myHero")</script>
<style>
myHero {
display: block;
background-color: #ddd;
padding: 50px;
font-size: 30px;
}
</style>
</head>
<body>
<myHero>我的第一个新元素</myHero>
</body>
</html>
JavaScript语句document.createElement("myHero")是为ie浏览器添加新的元素，但是ie8及更早版本不支持以上方式，我们可以使用以下方式来解决该为题：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>渲染 HTML5</title>
<!--[if lt IE 9]>
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<article>
我的第一个新元素
</article>
</body>
</html>
以上就是完美的Shiv解决方案。
HTML5浏览器支持及兼容性处理的更多相关文章
- HTML5 简介、HTML5 浏览器支持
HTML5是HTML最新的修订版本,2014年10月由万维网联盟(W3C)完成标准制定. HTML5的设计目的是为了在移动设备上支持多媒体. HTML5 简单易学. 什么是 HTML5? HTML5 ...
- Html5浏览器支持
HTML5 浏览器支持 把 HTML5 元素定义为块级元素 语义块级displayblock实例 header, section, footer, aside, nav, main, article, ...
- HTML5 浏览器支持
css重置 header, section, footer, aside, nav, main, article, figure { display: block; } 为HTML添加新的元素 < ...
- 基于jQuery的让非HTML5浏览器支持placeholder属性的代码（转）
效果图:http://code.google.com/p/jquery-placeholder-js/ 演示代码:http://demo.jb51.net/js/2011/jqueryplacehol ...
- HTML5 简介、浏览器支持、新元素
什么是 HTML5? HTML5 是最新的 HTML 标准. HTML5 是专门为承载丰富的 web 内容而设计的,并且无需额外插件. HTML5 拥有新的语义.图形以及多媒体元素. HTML5 提供 ...
- HTML5浏览器
你可以学会如何使用旧的浏览器正确处理新的HTML5. HTML5 浏览器支持 HTML5 支持所有现代浏览器. 此外,所有的浏览器,旧的和新的,自动处理未被识别的元素作为内联元素. 因为这样,你可以& ...
- html5录音支持pc和Android、ios部分浏览器，微信也是支持的，JavaScript getUserMedia
以前在前人基础上重复造了一个网页录音的轮子,顺带把github仓库使用研究了一下,扔到了github上. 优势在于结构简单,可插拔式的录音格式支持,几乎可以支持任意格式(前提有相应的编码器):默认提供 ...
- IT兄弟连 HTML5教程 设置IE9以下版本浏览器支持HTML5
HTML2.HTML5刚发布时由于各浏览器之间的标准不统一,开发者的时间都浪费在解决Web浏览器之间的兼容性上.但由于W3C和WHATWG对HTML5新版本的制定,以及近年来对HTML5的使用,再加上 ...
- 解决低版本IE关于html5新特性的兼容性问题html5shiv.js和Respond.js，以及excanvas.js解决低版本IE不支持canvas的问题
插件:html5shiv.js 让IE9以下版本支持html5新标签,git地址https://github.com/aFarkas/html5shiv 用于解决IE9以下版本浏览器对HTML5新增标 ...
随机推荐
- OpenCV与MFC实战之图像处理 样本采集小工具制作 c++MFC课程设计
原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/12111102.html 入门不久的人可以通过opencv实战来锻炼一下学习opencv的成果, ...
- shell 脚本文件十六进制转化为ascii码代码, Shell中ASCII值和字符之间的转换
Shell中ASCII值和字符之间的转换 1.ASCII值转换为字符 方法一: i=97 echo $i | awk '{printf("%c", $1)}' ...
- com.netflix.discovery.DiscoveryClient : Completed shut down of DiscoveryClient
启动报错:com.netflix.discovery.DiscoveryClient : Completed shut down of DiscoveryClient 解决方案: 添加web主件 ...
- tcp短连接和长连接
1. TCP连接 当网络通信时采用TCP协议时,在真正的读写操作之前,server与client之间必须建立一个连接,当读写操作完成后,双方不再需要这个连接时它们可以释放这个连接,连接的建立是需要三次 ...
- 第二阶段：4.商业需求文档MRD：4.PRD-用例和规则
类似之前的泳道图 可以在下面添加一些描述 有时候用图还是会有一些限制 不能够很好的表达
- 超简单本地mock假数据测试，模拟后台数据返回必杀技
温馨提示:急性子可以直接拉到最后观看方法步骤. 什么是mock? mock就是在开发过程中,对于某些不容易构造或者不容易获取的对象,用一个虚拟的对象来创建以便测试开发的方法. 使用mock有什么好处? ...
- spring boot（一）创建项目
网上有很多springboot的入门教程,自己也因为项目要使用springboot,所以利用业余时间自学了下springboot和springcloud,使用下来发现springboot还是挺简单的, ...
- ECShop二次开发指南（一）
ECSHOP是一套完整的网络商店解决方案,包括前台的商品展示.购物流程和强大易用的后台管理.由于 ecshop简单易用,使用者几乎可以在3几分钟简单的设置一下就可以拥有一个网上商店系统,所以很多的B2 ...
- VS/Xamarin Android入门一
一.安装和配置(以Visual Studio Pro 2015为例) Visual Studio2015直接提供了这个插件的选择项,稍微提示一下,如果要安装的话,最好准备好十个小时的打算,而且是网速不 ...
- 「Luogu P2201」数列编辑器 解题报告
数列编辑器,在线IDE 本期的主题是洛谷的在线IDE 小学生?!小学生虐我