Zoom Vs. Échelle en CSS3

J'ai été la recherche de quelques propriétés css que je n'ai jamais utilisé et en est venu à connaître zoom propriété de css3

• Qu'est-ce que les similitudes et les différences entre eux?

• Quand utiliser le Zoom et lors de l'échelle? Les deux fait à peu près le même travail.

• Qui est plus efficace de les utiliser et Pourquoi?

Ce que j'ai remarqué?

• les deux échelles de l'objet, mais par défaut de transformer l'origine de l'échelle de son centre et de son zoom en haut à gauche je pense;

• lorsque nous les utilisons pour la mise à l'échelle sur le vol stationnaire, de zoom, de mise à l'échelle et, de nouveau, se rétrécit à l'origine dimention, tandis que l'échelle ne se rétrécir sur le vol stationnaire-out.
  -->> jsfiddle montrant passez effectst**

CSS:

*
{
    -webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}

box, box2
{
    display: inline-block;
    width: 100px;
    height: 100px;
    
    margin: 20px;
}

box
{
    background: #b00;
}

box:hover
{
    zoom: 1.1;
}

box2
{
    background: #00b;
}

box2:hover
{
    -webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

HTML:

<box></box>
<box2></box2>

---

Certains Stackoverflow QA

• Qu'est - 'zoom' faire en CSS?

• Zoom rapport de transformation à l'échelle

CSS:

div {
  display: inline-block;
  height: 50px;
  width: 50px;
}
.one {
  background: #07a;
  -webkit-transform: scale(2);
  -moz-transform: scale(2);
  -ms-transform: scale(2);
  -o-transform: scale(2);
  transform: scale(2);
  transform-origin: top top;
}
.two {
  background: #eee;
  zoom: 200%;
  margin-left:100px;
}

.three {
  background: #07a;
  transform-origin: top left;
  transition:all 0.6s ease;
}

.three:hover{
  -webkit-transform: scale(2);
  -moz-transform: scale(2);
  -ms-transform: scale(2);
  -o-transform: scale(2);
  transform: scale(2);
}

.four {
  background: #eee;
  transition:all 0.6s ease;
}

.four:hover{
  zoom: 200%;
}

HTML:

<h4>Already zoomed and scalled</h4>
<div class="one"></div>
<div class="two"></div>
<hr>
<h4>Zoomed and Scalled on hover</h4>
<div class="three"></div>
<div class="four"></div>