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新增标 ...
随机推荐
- Python安装jpype调用java，安装jaydebeapi通过jdbc连接数据库
pip install JPype1或下载JPype1-0.7.0.tar.gz包 经常出现需要安装VC++服务等 测试代码如下: # Author: zfh import jpype,os,time ...
- Channel 9视频整理【5】
Jennifer Chiu https://channel9.msdn.com/Niners/JenniferChiu
- AS优化
第一步:打开AS安装所在的位置,用记事本打开“红色框”选中的文件. 如图: 第二步:打开“studio64.exe.vmoptions”文件后修改里面的值,修改后如下: 1 2 3 4 5 6 7 8 ...
- java环境所遇问题
在javac能运行通过并且生成了.class文件但是java文件在运行时通不过出现上面图片情况,试了一上午发现我的和别人好像不一样,下面展示我的情况, 之前用户变量那里新建了一个classpath,不 ...
- 【一起学源码-微服务】Nexflix Eureka 源码九：服务续约源码分析
前言 前情回顾 上一讲 我们讲解了服务发现的相关逻辑,所谓服务发现 其实就是注册表抓取,服务实例默认每隔30s去注册中心抓取一下注册表增量数据,然后合并本地注册表数据,最后有个hash对比的操作. 本 ...
- 用WPF实现大数据分析，超炫的效果，还带地图
开头语 经过一段时间研究,终于实现CS和BS相同效果的大数据展示平台了.首先来看看实现的效果,超炫的效果,客户特别喜欢,个人也非常满意,分享给各位,同大家一起交流学习. 大数据展示平台 从上图可以看出 ...
- 有关call和apply、bind的区别及this指向问题
call和apply都是解决this指向问题的方法,唯一的区别是apply传入的参数除了其指定的this对象之外的参数是一个数组,数组中的值会作为参数按照顺序传入到this指定的对象中. bind是解 ...
- 阿里云函数计算 .NET Core 初体验
体验了一波阿里云函数计算, 已支持 .NET Core 2.1, 那么按照惯例, 来写个 "Hello World" 吧. 作者注: 开发环境 Windows 10 & V ...
- 手写vue observe数据劫持
实现代码: class Vue { constructor(options) { //缓存参数 this.$options = options; //需要监听的数据 this.$data = opti ...
- 2020 年 Java 程序员应该学习什么？
大家好,我相信大家在新的一年都有一个良好的开端,并准备好制定一个提升自我技术的目标.作为 Java 开发人员,我还制定了一些目标,希望在今年成为一名更好的 Java 开发人员. 如果你尚未制定目标,这 ...