CSS3 和 HTML5 兼容性测试

引言

你想知道你目前的WEB开发环境对CSS3和HTML5的支持情况和兼容性吗?如果想知道就跟我来,我会给你提供一些CSS3和HTML5的测试工具,来帮助你学习和应用这些新技术。

关于HTML5

HTML5是未来主要的HTML版本,HTML5给我们提供了很多更语义化的结构化的标签。例如,和布局有关的标签就是非常有意义的功能,这种语义化的特性不仅提升了我们网页的质量和语义,并且大量减少了曾经代码中用于CSS必须调用的class和id属性。

更多的HTML5新功能,我们不在这里做具体的阐述。

如果你想体验HTML5的新功能,请看下面的演示文档,几乎包括HTML5所有激动人
心的新功能的简介和DEMO。

中文版演示文档:http://directguo.com/html5/

英文原版:http://apirocks.com/html5/html5.html(需翻墙)

关于CSS3

CSS 技术我们已经并不陌生。而CSS3提供了非常多新途径去改善你的设计工作,且做了不少重要的变化。

CSS 3 新功能

圆角、多背景、@font-face 用户自定义字体、动画与渐变、渐变色、盒阴影、RGBa – 加入透明色、文字阴影等等
CSS3 的出现,让代码更简洁、页面结构更合理,性能和效果得到兼顾。

CSS3 和 HTML5 兼容性测试工具

简单的说了那么多,我们可以肯定的 认为CSS3 和 HTML5 的组合会成为下一个Web标准,而且越来越多的浏览器开始支持它们的新属性,一向让我们头疼的IE 也要马上推出Internet Explorer 9 ,对CSS3 和 HTML5 也有一定的支持。

 

有兴趣的可以看一下 IE9 的 Test Drive

 

ie9-test-drive

CSS3 Selectors Test

你想知道您的浏览器对CSS3 Selectors的支持情况吗,只要我们在相应的浏览器中运行此测试套件页面,将自动运行一个小测试,能马上知道您的浏览器 是否 支持 与之相配的CSS Selectors。测试完毕以后,您可以点击每个CSS Selectors来查看结果,其中包括一个小例子,并为每个测试做出解释。因为它在技术上是不可以 与某些用户 进行 交互 模拟测试某个或某几个CSS Selectors ,目前只能批量测试 CSS Selectors 。所以这个测试套件不包括以下的选择器测试::hover, :active, :focus and :selection 。

css3-slecetore

 

还等什么! 点击 The CSS3 Selectors test 页面进行测试。

 

HTML5 Test

你想知道您的浏览器对HTML5的支持情况吗,我们用最直观的测试数据告诉您!

html5-test

 

还等什么! 点击 The HTML5 test 页面进行测试。

 

CSS3 和 HTML5 兼容速查表

FindMeByIP.com 为我们提供了CSS3 和 HTML5 兼容速查表,已经在所有的A级浏览器中测试过,结果非常有趣。

css3-and-html5-test

总之,这些丰富的测试工具,为我们的CSS3 + HTML5 的开发和应用带来了方便,不过这些新东西暂时还不能大量的应用到我们的客户项目中,还得需要很长的时间进行过渡,所以 我们要三思而后行,以免带来麻烦。

肯定的是,它们是未来WEB标准的主角,早点学习是没错的。我们可以把这些新技术应用到我们的博客或者是Web设计社区中,提前体验和实战。

站点统计