webkit和moz有什么区别 [英] What is the difference between webkit and moz

问题描述

我不明白 -webkit-animation 和 -moz-animation 之间的区别.这两者或这些有什么区别，还是一样?

I do not understand the difference between -webkit-animation and -moz-animation. What is the difference in between the two or these, or are the same?

我用谷歌搜索了这个问题，但找不到差异.

I googled this question but couldn't find out the differences.

代码示例如下:

.blink_me {
 font-size:60px;
 font-weight:bold;
-webkit-animation-name: blinker;
-webkit-animation-duration: 1.5s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;

-moz-animation-name: blinker;
-moz-animation-duration: 1.5s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;

animation-name: blinker;
animation-duration: 1.5s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}

@-moz-keyframes blinker 
{  
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}

 @-webkit-keyframes blinker
 {  
 0% { opacity: 1.0; }
 50% { opacity: 0.0; }
 100% { opacity: 1.0; }
 }

@keyframes blinker
{  
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}

在这段代码中 -webkit-animation ,-moz-animation 最后使用了简单的 animation 为什么这三个被使用使用相同的功能?

Here in this code -webkit-animation ,-moz-animation and at last the simple animation is used why these three are being used with same functionalities?

推荐答案

这些是浏览器的不同渲染引擎(gecko、blink、webkit、trident 等)使用的供应商前缀属性

These are the vendor-prefixed properties used by different rendering engines of browsers(gecko,blink,webkit,trident etc)

 -webkit for Chrome(blink,webkit), Safari(webkit) and Opera(blink); 
 -moz for Firefox(gecko), 
 -o for Opera(presto), 
 -ms for Internet Explorer(Trident). 

通常它们用于实现专有的 CSS 功能，或者浏览器公司仍在为它应该实现的方式而争论不休，直到 W3 最终确定.

Usually they're used to implement CSS features that are proprietary or the browser companies are still fighting over on the way it is supposed to be implemented, until finalisation by W3.

使用前缀允许为每个渲染引擎设置属性，以便您可以调整 css 以适应不同的实现.

Using prefixes allows properties to be set to each rendering engine so you can tweak your css to adjust for the different implementations.

理论上，在解决不一致问题后，前缀将被删除.但是，您总是需要为旧版本的浏览器编写和支持 CSS 代码，因此在实践中，您需要花费大量时间才能删除前缀.

In theory after the inconsistencies are resolved the prefix will be removed. However there are always older versions of the browser you need to write and support CSS code for, so in practice it will take a lot of time before you can drop the prefix.

另请注意，按照惯例先声明前缀版本，然后声明标准版本，因此如果更新规范，标准版本将覆盖前缀版本

Also note that it's convention to declare the prefixed version first and then the standard version, so if and when the specifications are updated, the standard version will override the prefix versions

这篇关于webkit和moz有什么区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！