如今HTML5愈来愈引发大家的关注了，但目前支持HTML5的浏览器还不是主流，特别是国内用户近50%以上仍旧使用IE6，由于支持HTML5的IE9不支持Xp系统安装，这样未来很长一段时间，HTML5的开发者将必须考虑向下兼容的问题。HTML5的标签或CSS选择器兼容性的做法有很多，其中自己生成标签元素就是一种。

基本原理参见如下代码在IE8中效果，样式根本没有起作用。

<html>
<head>
<style>mxria{ color: red; }</style>
</head>
<body>
<mxria>Hello!</mxria>
</body>
</html>



为了是浏览器识别<mxria></mxria>标签并显示对应样式的效果，我们可以如下增加一段js，看到效果就不同了


<html>
<head>
<style> mxria{ color: red; }</style>
<script>document.createElement("mxria")</script>


</head>
<body>
<mxria>Hello!mxria.com</mxria>
</body>
</html>







现在大家明白了其中的奥妙吧！对，就是document.createElement ，HTML5 shiv就是这样一个js插件，将所有HTML5的标签进行了重新生成，你需要加载该插件，那么HTML5程序就能被所有浏览器识别了。




下载地址：http://html5shim.googlecode.com/svn/trunk/html5.js
												


											
让所有的浏览器都能识别HTML5标签样式的小插件的更多相关文章
	

    
								
  1. HTML5网页如何让所有的浏览器都能识别语义元素标签样式
		
    浏览器对语义元素的支持情况 如今HTML5愈来愈引发大家的关注了,但目前支持HTML5的浏览器还不是主流,特别是国内用户近50%以上仍旧使用IE6,由于支持HTML5的IE9不支持Xp系统安装,这样未 ...
    
		
    2. 
						
  2. 在IE6/7/8下识别html5标签
		
    识别html5标签: html5添加了许多语义化的标签,比如<nav></nav>,<aside></aside>,<article>< ...
    
		
    3. 
						
  3. 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式
		
    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
    
		
    4. 
						
  4. 为什么每个浏览器都有Mozilla字样？
		
    你是否好奇标识浏览器身份的)”,于是IE可以收到含有框架的页面了,所有微软的人都嗨皮了,但是网站管理员开始晕了. 因为微软将IE和Windows捆绑销售,并且把IE做得比Netscape更好,于是第一 ...
    
		
    5. 
						
  5. 解决：Eclipse导入工程后全是错误，连基本类型都不识别
		
    当初在大学没时间完成作业时,总是喜欢网上搜一个或者拷贝同学的一个工程过来,导入到Eclipse中却全是红叉,连基本类型都不识别. 当时就纳闷了,难道是天要亡我之心不死?后来慢慢了解了,其实是导入的工程 ...
    
		
    6. 
						
  6. 为什么每个浏览器都有Mozilla
		
    你是否好奇标识浏览器身份的User-Agent,为什么每个浏览器都有Mozilla字样? Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36  ...
    
		
    7. 
						
  7. 每次用 selenium 操作浏览器都还原了 (比如没有浏览器历史记录)
		
    每次用 selenium 操作浏览器都还原了 (比如没有浏览器历史记录)
    
		
    8. 
						
  8. FormData上传文件(不是所有的浏览器都支持)
		
    <h1>Ajax上传文件</h1> <div> <input type="file" id="img"/> &l ...
    
		
    9. 
						
  9. 苹果的浏览器safari无法识别 2016-1-1这样的日期，会返回Invalid Date
		
    1.很多时候我们遇到的日期是2016-1-1这样的,中间是带横线的,但是有时候我们需要转化为标准的时间,即使用new Date(time)这样的方法,这时在safari浏览器里面Invalid Dat ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Play modules
			
    A Play application can be assembled from several application modules. This allows you to reuse appli ...
    
			
    2. 
						
  2. Libscore – 收集 JavaScript 库的使用数据
			
    Libscore 扫描网络上成千上万的网站,收集统计 JavaScript 库的使用数据.在搜索框中,输入关键词,例如 jQuery, Modernizr, $.ui 或者 $.fn.fancybox ...
    
			
    3. 
						
  3. SqlServer灾备方案（本地）
			
    如果你曾经有那么一个不经意的心跳来自于数据库数据损坏:错误的新增.更新.删除 .那么下面的方案一定能抚平你的创伤! 对于一个数据库小白来说,数据库的任何闪失带来的打击可说都是致命的.最初,我们让一个叫 ...
    
			
    4. 
						
  4. 程序员用HTML5制作的爱心树表白动画
			
    体验效果:http://keleyi.com/keleyi/phtml/html5/31.htm 推荐:http://hovertree.com/texiao/css3/18/ HTML代码如下: & ...
    
			
    5. 
						
  5. Egret白鹭H5小游戏开发入门（二）
			
    前言: 昨天的文章中简单的介绍了Egret白鹭引擎从安装到基本的使用配置等问题,今天着重介绍H5小游戏开发的起步阶段,如Wing面板的使用,素材的处理,类的说明,开始布局等等. 整体概况: 根据上一篇 ...
    
			
    6. 
						
  6. 前端框架bootstrap 表单和导航菜单的 Demo（第二篇）
			
    表单: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <tit ...
    
			
    7. 
						
  7. Android Fragment使用(四) Toolbar使用及Fragment中的Toolbar处理
			
    Toolbar作为ActionBar使用介绍 本文介绍了在Android中将Toolbar作为ActionBar使用的方法. 并且介绍了在Fragment和嵌套Fragment中使用Toolbar作为 ...
    
			
    8. 
						
  8. LinearLayout布局问题
			
    LinearLayout是平时开发中很常见的线性布局方式,分为水平和竖直2种,笔者在实际使用中发现了如下问题,希望能帮到别人. 横着的LinearLayout,凡是设置x坐标的属性都不起作用,比如la ...
    
			
    9. 
						
  9. 通过VLD扩展分析PHP opcode
			
    安装VLD扩展 ./configure --with-php-config=/usr/local/php/bin/php-config --enable-vld 生成脚本opcode   > p ...
    
			
    10. 
						
  10. Linux MySQL源码安装缺少ncurses-devel包
			
    在Red Hat Enterprise Linux Server release 5.7 上用源码安装MySQL-5.6.23时,遇到了" remove CMakeCache.txt and ...
    
			
    11.