哆啦A梦欺骗了你!浏览器CSS3测试遭质疑

软件 JuestChaOS 2010-05-25 10:24

  之前我们有报道过日本牛人编写的一个浏览器对CSS3支持的哆啦A梦演示。在该演示中,IE全灭,甚至可以说是惨不忍睹。Chrome支持得相当完美。

  新闻回顾:《哆啦A梦来告诉您浏览器对CSS3的兼容效果》,没有玩过的朋友也可以到这里围观下:传送门

css3-test-doraemon-01
在 Chrome 下支持最完美

  这个相当有趣的实验,一方面让Webkit浏览器扬眉吐气了一番;另一方面也显示出IE的残缺。但最近有人对这个测试表示怀疑,指该测试使用了偏向性代码,测试的CSS代码偏向于支持Chrome,Safari等Webkit浏览器。下面是图解说明:

css3-test-doraemon-02
各个内核浏览器效果对比

css3-test-doraemon-03
相当悲剧的IE家族

  上面两张图是这个CSS3浏览器测试页面的测试结果,从近一年来的浏览器内核大战的角度来看,此网页所表达的意思就是:使用Webkit引擎的Safari和ChromeCSS3的支持最好,Firefox其次,因为Firefox无法实现CSS3的动画效果(即哆啦A梦的眼睛移动动画渲染失败),其他浏览器CSS3渲染的表现则很差。但事实真的是这样吗

  我们查看下这个演示的源码,会发现有很多针对特定浏览器内核编写的代码:

  下面是实现哆啦A梦眼睛转动的部分代码:

css3-test-doraemon-04
Webkit特有代码

  注意图中红框出,-webkit- 开头的属性。就是哆啦A梦的黑色眼睛部分的CSS3移动特效,据闻这是被指定了webkit 内核only,即只有使用webkit 内核的Chrome和Safari可以使用。IE之类默认根本就不支持这个特性,其结果可想而知。

  实际上,不管Firefox也好,IE也好,浏览器都有很多独有的特性,要写一个其他浏览器不能渲染的页面太容易了。在演示CSS标准的时候使出这招,不给出任何说明,不知道高手们怎么看待这个问题。

  当然我们也能看到在其他CSS代码部分,比如face部分如下图红框处,也给出了针对Mozila和一般处理方式的代码,唯独上面的眼睛处,只看到webkit 内核指定。

css3-test-doraemon-05
face部分代码

  网友反馈:因为IE不支持这类型的代码,即使假设出同类型的代码,IE还是不能支持,这种专有的以内核开头的代码,是特定浏览器在CSS标准没有统一之前为了各自实现CSS3效果也编写的。但IE系列,无论怎么编写,使用什么代码,因为内核问题还是解析不了。

  Tips:

  解释下关于浏览器独有的CSS特性:

  比如Mozilla浏览器支持一些扩展的CSS是以-moz开头的。这些措施包括了一些功能,包括圆形边界,并能够指定不同的方块的宽度和高度的计算,在非标准方式下,这种css在Mozilla浏览器下执行计算更容易得到支持。

  原文:IE集体自杀 最新CSS浏览器测试公平性遭质疑

收藏

网友评论

写评论

聚超值推荐

相关推荐

2019年国庆放假安排及调休安排

2019年国庆放假安排及调休安排

网络辅助 0

2019LOL无限火力开启时间 无限火力什么时候开

2019LOL无限火力开启时间 无限火力什么时候开

游戏攻略 0

5G手机有没有必要买?教你查5G覆盖率到底有多高

5G手机有没有必要买?教你查5G覆盖率到底有多高

网络辅助 4

LOL9月幸运召唤师活动地址 幸运召唤师活动技巧

LOL9月幸运召唤师活动地址 幸运召唤师活动技巧

游戏攻略 0

不再被语音信息烦到爆!微信7.0.7新版体验

不再被语音信息烦到爆!微信7.0.7新版体验

Android资讯 4

发工资也是一种痛苦!这招一分钟搞定工资条

发工资也是一种痛苦!这招一分钟搞定工资条

Excel 3

LOL2019无限火力开放时间 无限乱斗模式回归时间

LOL2019无限火力开放时间 无限乱斗模式回归时间

游戏攻略 0

云顶之弈9.18版本全新装备合成表一览

云顶之弈9.18版本全新装备合成表一览

游戏攻略 1

PhotoShop的“bug”这么多?解决方法都在这了

PhotoShop的“bug”这么多?解决方法都在这了

Photoshop 3

lol9月幸运召唤师活动时间 幸运召唤师9月地址

lol9月幸运召唤师活动时间 幸运召唤师9月地址

游戏攻略 0