28172 sujets

CSS et mise en forme, CSS3

Bonjour,
Voici une question qui me turlipine depuis déjà un bon moment : Pourquoi utiliser des préfixes vendeurs ?

J'ai bien lu l'article de Dew http://www.alsacreations.com/article/lire/1159-prefixes-vendeurs-css-proprietaires.html mais j'en n'ai pas trouvé l'utilité.

  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;


Si j'ai bien compris, pour le code ci-dessus, Firefox lira la première ligne, Chrome la deuxième et les autres la dernière. Et comprendra qui pourra.
Donc autant mettre uniquement la dernière ligne ?
Modifié par benj (18 Oct 2011 - 15:52)
Salut,

Dans l'exemple que tu donnes, seules les versions de Firefox, de Safari et de Google Chrome qui ne prennent pas en charge border-radius liront la propriété précédée du préfixe correspondant à leur moteur de rendu (-moz- pour Firefox, -webkit- pour les deux autres).

Ce genre de préfixe est utile pour deux choses :
1. l'utilisation d'une propriété propriétaire,
2. l'utilisation d'une propriété CSS en cours d'élaboration dans une spécification CSS en chantier et qui n'est pas encore finalisée (en gros, pour une implémentation à titre expérimental).

En ce qui concerne border-radius, il s'agit d'une propriété CSS 3 dont la syntaxe est désormais arrêtée par l'équipe qui en est en charge au W3C et est prise en charge sans préfixe par Firefox depuis la version 4, Safari et Google Chrome depuis la version 5, Opera depuis la version 10.5 et IE depuis la version 9 (ces deux derniers navigateurs n'étant, d'ailleurs, pas passés par le stade de l'implémentation par préfixe).
Ok pas besoin de préfixes pour border-radius mais aussi j'imagine pour transition et box-shadow.
Donc si la propriété css est bien en place pas besoin d'utiliser les préfixes.

Bon j'imagine que c'est prévue pour le cas ou la spécification change entre le moment ou elle est à l'état de chantier et entre le moment ou elle est finalisée.
benj a écrit :
mais aussi j'imagine pour transition et box-shadow

Ne parle pas trop vite pour ces deux-là.
benj a écrit :
Bon j'imagine que c'est prévue pour le cas ou la spécification change entre le moment ou elle est à l'état de chantier et entre le moment ou elle est finalisée.

Tu en as compris la raison. Smiley cligne
Administrateur
benj a écrit :
Donc si la propriété css est bien en place pas besoin d'utiliser les préfixes.

C'est tout à fait ça : le W3C demande aux constructeurs d'utiliser un préfixe tant qu'une propriété ou valeur n'est pas finalisée.
Lorsqu'elle est finalisée, le préfixe doit être supprimé et la propriété reconnue par le navigateur.

Le problème est que les versions précédentes du navigateur auront encore besoin du préfixe.
benj a écrit :
Donc si la propriété css est bien en place pas besoin d'utiliser les préfixes.

À voir au cas par cas:
http://caniuse.com/border-radius -> plutôt ok sans préfixes
http://caniuse.com/box-shadow -> -webkit-box-shadow encore utile sur les mobiles
http://caniuse.com/transition -> préfixes pour tout le monde!
etc.

benj a écrit :
Bon j'imagine que c'est prévue pour le cas ou la spécification change entre le moment ou elle est à l'état de chantier et entre le moment ou elle est finalisée.

Tout à fait. Parfois les premières implémentations font ressortir des manques ou des défauts de la spec, et celle-ci est corrigée grâce à l'expérience retirée de ces premières implémentations. C'est le cas actuellement pour le module CSS3 Flexible Box Layout, par exemple.
Raphael a écrit :

Le problème est que les versions précédentes du navigateur auront encore besoin du préfixe.


On a connu pire. Smiley smile