微软出的IE9支持HTML5,但因为不支持XP系统,暂时我还用不了。
即使能用,现阶段如果开发HTML5页面,并考虑到兼容性问题的话,恐怕也得让自己的界面支持IE6-8吧。
首先,需要让IE支持HTML5标签。这个简单,随便在网上搜一下就能找到。下载一个html5.js,并拷贝到自己的目录里就可以了。
现在写一段简单代码,其功能是在页面上放置一个canvas,并画一个红色圆圈。
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 2 <HTML> 3 <HEAD> 4 <TITLE> IE8支持HTML5+CSS3 </TITLE> 5 <head> 6 7 <style type="text/css"> 8 body { 9 background: #444;10 color: #FFF;11 font-family: Helvetica, Arial, sans-serif;12 text-align: center;13 }14 15 #cv {16 width: 600px; height: 400px;17 background: #000;18 border-radius: 20px;19 padding: 20px;20 margin: 20px auto;21 box-shadow: 0 0 40px #222;22 }23 </style> 24 25 <script type="text/javascript">26 function test() { 27 var ctx = document.getElementById("cv").getContext("2d"); 28 29 ctx.fillStyle = "#aa0000"; 30 ctx.beginPath(); 31 ctx.arc(100, 100, 25, 0, Math.PI*2, true); 32 ctx.closePath(); 33 ctx.fill(); 34 } 35 36 window.onload = test; 37 </script> 38 39 </head> 40 41 <body> 42 <canvas id="cv"></canvas> 43 </body>
段代码,在遨游和Firefox上,都可以用。但在IE8里,不但什么都没有,下面状态栏里还会显示黄色小叹号,点开,告诉我们,ctx根本没取到canvas。
第一步,我们加上对html5的支持。
<!--[if IE]> <script src="/public/html5.js" type="text/javascript"></script> <![endif]-->
现在再看,会出现一个黑漆漆的框框,说明IE8已经认识canvas标签了。但红圈圈还是没出来,下面状态栏仍然提示我们JS里压根没取到canvas。这说明IE还只是认识了canvas是个合法标签而已,至于怎么处理它,对不起,俺还不会。
第二步,加上对canvas的支持。
下载excanvas_r3.zip,解压后,把excanvas.compiled.js拷贝到自己的目录里,引用它。现在看看,哈,一个红色圈圈出现了!js works!
<!--[if IE]> <script type="text/javascript" src="/public/html5.js"></script> <script type="text/javascript" src="/public/excanvas.compiled.js"></script> <![endif]-->
如果您足够细心,您会发现,样式表中存在这么两行:
border-radius: 20px; box-shadow: 0 0 40px #222;
这是CSS3的样式哦!border-radius说明我们要的黑框框四周应该是圆角才对,但现在却四愣八插的;box-shadow那儿还有shadow呢。。。
下面是第三步,让IE支持CSS3。在cv选择器的最后,增加一句话
behavior: url(/public/ie-css3.htc);
#cv { width: 600px; height: 400px; background: #000; border-radius: 20px; padding: 20px; margin: 20px auto; box-shadow: 0 0 40px #222; behavior: url(/public/ie-css3.htc);}
其中,ie-css3.htc去 http://fetchak.com/ie-css3/ 下载,具体它能够支持多少CSS3特性,网站说的很清楚,我就不费口舌了。
最后,在我们下载了三个文件,增加了三句话之后,看看效果吧。嘻嘻!
相关推荐
标题"让IE8和IE9支持Html5和Css3"指的是一个目标,即如何在不支持新特性的旧版IE浏览器上实现Html5和Css3功能。这个压缩包提供了一些关键的JavaScript库,帮助解决这个问题。 首先,`css3-mediaqueries.js`是针对IE...
为了进一步理解这个主题,你可以解压并查看这些文件,它们可能包括HTML、CSS和JavaScript代码,展示了如何在IE6中实现类似CSS3的效果。在实际项目中,通常建议尽可能避免对旧版本浏览器的特殊适配,转而采用渐进增强...
ie-css3.htc是一种行为复合内容(Behavior Composite Content)文件,它是微软在Internet Explorer中引入的一种技术,允许HTML元素通过链接外部的HTC文件来实现某些特定的脚本功能。在本例中,ie-css3.htc是一个...
总的来说,为了让IE支持CSS3,开发者需要理解`.htc`文件的工作原理,以及如何利用`behavior`属性将这些文件与HTML元素关联起来。尽管这种方法在某些场景下是有效的,但随着现代浏览器的普及和IE市场份额的减少,...
这是一个对IE8及以下做前端兼容的文件工具...--对于ie6到ie8做兼容,兼容h5,css3等新特性--> <!--[if (gte IE 6)&(lte IE 8)]> [removed][removed] [removed][removed] [removed][removed] <![endif]-->
IE8,作为一款老版本的Internet Explorer,不支持HTML5和CSS3的新特性,这为开发者带来了不少挑战。针对这种情况,开发者通常需要寻找特定的解决方案来实现对这些新特性的模拟,以便在IE8上也能正常显示和运行。以下...
Modernizr是一种开源工具,它可以检测浏览器对HTML5和CSS3特性的支持情况,并根据检测结果动态添加相应的类到HTML元素上,这样我们就可以针对不同的浏览器实现特性检测和降级处理。 一句JS代码如下: ```...
5. **使用方法**:通常,开发者会在CSS文件中通过`behavior`属性引用.htc文件,如`-ms-behavior: url(/path/to/ie-css3.htc);`。这种方法有一定的局限性,如性能问题、跨域限制以及不支持所有CSS3特性。 6. **替代...
IE6至IE8不支持很多CSS3特性,这是因为它们基于较旧的渲染引擎,而IE9及以后版本虽然改进了对CSS3的支持,但仍无法与现代浏览器相提并论。因此,开发者需要采取一些策略来解决这个问题。 **解决方案1:使用条件注释...
在开发Web应用时,我们经常会遇到一个问题:如何确保在IE8及以下版本的浏览器中实现对HTML5新标签和CSS3高级选择器的良好兼容性。这些老版本的Internet Explorer(尤其是IE8)并不原生支持许多HTML5特性及CSS3的新...
标题中的“IE支持CSS3 HTML5插件”指的是在Internet Explorer(简称IE)浏览器中,由于其自身对CSS3和HTML5新特性的支持不足,需要借助特定的插件来实现对这些现代Web标准的兼容。这两项技术,CSS3和HTML5,是Web...
在早期的Internet Explorer浏览器,即IE6、IE7和IE8,它们并不支持CSS3的一些新特性,如圆角和阴影效果。这些特性在现代浏览器中已经非常常见,可以为网页设计提供更丰富的视觉体验。为了让这些老版本的IE浏览器也能...
总的来说,"iecss3.htc"是一个针对旧版IE浏览器实现CSS3圆角的兼容性解决方案,虽然现在其重要性已不如从前,但在处理老项目或照顾到仍然使用旧版IE的用户时,它仍是一个有价值的工具。然而,随着技术的进步,我们...
7. **使用Modernizr**:Modernizr是一个JavaScript库,可以帮助检测浏览器对各种HTML5和CSS3特性的支持情况,从而实现优雅降级或渐进增强。 8. **调试工具**:利用IE9和IE10内置的开发者工具(按下F12键打开),...
然而,IE(Internet Explorer)浏览器,特别是早期版本,对CSS3的支持并不完全,这使得开发者在创建跨浏览器兼容的网站时面临挑战。本文将详细探讨如何使IE支持CSS3的部分功能,包括阴影背景效果、圆角效果和渐变...
- **使用前缀:** 对于支持CSS3特性的浏览器,可以使用浏览器特定的前缀(如`-webkit-`、`-moz-`等),以确保这些特性能够在目标浏览器中正确渲染。 - **使用Polyfill:** 对于一些新出现的CSS特性,可以使用Polyfill...
1. PIE_uncompressed.htc:这是CSS3 Pie的核心文件,它是一个行为组件(Behavior Component),通过HTC(HTML Components)技术,将JavaScript代码嵌入到HTML文件中,使得IE可以理解CSS3的属性。 2. PIE_...
标题中的“让ie6,7,8支持canvas,css3等主流html5技术”涉及到的是在旧版Internet Explorer(IE6、IE7、IE8)上实现HTML5新特性的兼容性问题。这些浏览器并不原生支持HTML5的新功能,如Canvas画布和CSS3,但可以通过...
标题中的“ie8兼容html5 css3圆角阴影渐变placeholder等属性”指的是在IE8浏览器上实现HTML5和CSS3的一些新特性,包括圆角、阴影、渐变以及placeholder属性的支持。这些特性在现代浏览器中是标准支持的,但在较旧的...
HTML5+CSS3 学习总结 HTML5 是万维网的核心语言、标准通用标志语言下的一个应用超文本标志语言(HTML)的第五次重大修改,作为 HTML 语言,具有新的元素、属性和行为。广义的 HTML5 是 HTML5 本身 + CSS3 + ...