Pourquoi mozilla et webkit font-ils précéder les règles CSS3 de -moz- et -webkit- ?

Question

Les règles CSS3 apportent de nombreuses fonctionnalités intéressantes.

Tome bordure-radius par exemple. La norme dit que si vous écrivez cette règle :

div.rounded-corners {
  border-radius: 5px;
}

Je devrais obtenir un rayon de bordure de 5px.

Mais ni mozilla ni webkit ne l'implémentent. Cependant, ils implémentent la même chose, avec les mêmes paramètres, avec un nom différent ( -moz-border-radius y -webkit-border-radius respectivement).

Afin de satisfaire le plus grand nombre de navigateurs possible, on obtient ceci :

div.rounded-corners {
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

Je vois deux inconvénients évidents :

• Copier-coller le code. Cela présente des risques évidents que je ne discuterai pas ici.
• El Validateur CSS du W3C ne validera pas ces règles.

En même temps, je ne vois pas d'avantages évidents.

Je crois que les personnes derrière mozilla et webkit sont plus intelligentes que moi. Il doit y avoir de bonnes raisons pour que les choses soient structurées de cette façon. C'est juste que je ne les vois pas.

Alors, je dois vous demander : pourquoi ?

Answer 1

El -moz-border-radius décrit la sémantique de Mozilla. Si CSS3 est publié avec une sémantique différente, alors Mozilla peut toujours implémenter border-radius en utilisant ceux sémantique et ils ne casseront le site web de personne.

Pendant ce temps, s'ils ont juste utilisé border-radius directement, alors si CSS3 est publié avec une sémantique différente, Mozilla doit choisir entre casser les sites des gens, ou supporter éternellement les CSS non standard.

Answer 2

Ils font cela parce que ce n'est pas entièrement supporté. C'est un peu comme avoir ce code en version bêta. Ils finiront par ajouter le support pour border-radius.

C'est plus évident lorsque l'on regarde les gradients linéaires.

background-image: -moz-linear-gradient(100% 100% 90deg, #2F2727, #1a82f7);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#2F2727));

Remarquez qu'ils n'utilisent pas la même syntaxe. Lorsqu'ils se mettront enfin d'accord sur une norme, ils ajouteront tous deux la prise en charge du dégradé linéaire et utiliseront la syntaxe correcte.

Answer 3

Simple. Les variantes propriétaires -moz y -webkit étaient là avant le site border-radius a été intégré dans la recommandation CSS3. Ils avaient leurs propres implémentations mais ne savaient pas si elles correspondraient à la recommandation finale du W3C. Ils n'ont donc pas non plus utilisé le nom désormais officiel à ce moment-là, afin de ne pas casser les choses par la suite.

Answer 4

Notez que en date du 2010-09-14 le préfixe -moz a été supprimé de border-radius. Cela signifie que Firefox 4 prendra en charge border-radius sans préfixe.